JavaScript小匯（4）——函式、變數作用域、方法

阿新 • • 發佈：2021-02-03

文章目錄

函式

定義

function abs(x){
    if (x>0) {
        return x;
    } else{
        return -x;
    }
}
abs(20);
>20
abs(-20);
>20

var num = function(x){
    if (x>0) {
        return x;
    } else{
        return -x;
    }
}
abs(12);
>12
abs(-12);
>12

手動丟擲異常

var num = function(x){
            if (typeof num!= 'number') {
                throw 'num not a number';
            }
            if (x>0) {
                return x;
            } else{
                return -x;
            }
        }
abs('a');
>NaN

var num = function(x){
    if 
 (x>0) {
        return x;
    } else{
        return -x;
    }
}
abs('1');
>"1"

arguments

JS函式有個內建的物件 arguments 物件。

argument 物件包含了函式呼叫的引數陣列,即輸入的所有引數(顯式宣告和隱式宣告)

function S(){
    var i,sum=0;
    for (let i =0;i<arguments.length;i++) {
        sum +=arguments[i];
    }
    console. 
log(sum);
}
var numS = S(1,2,3,4,5);
>15

rest

可以直接顯示隱式傳入的引數

function fu(x,y,...rest){
    console.log(rest);
}
fu(1,2,3,4,5,6);
>Array(4) [ 3, 4, 5, 6 ]

變數作用域

var定義的變數有作用域

function test(){
    var x = 2;
}
x=x+1;//x is not defined

內部函式可以使用外部函式的成員，反之不能

function test(){
    var x = 2;
    function test1(){
        var y = x+1;
    }
}
var z = y+1;//y is not defined

只要在不同的函式中，即使變數名相同也無所謂

function test2(){
    var x = 2;
}
function test3(){
    var x = 2;
}

當變數重名時，內部的變數會覆蓋外部的同名變數

function test2(){
    var x = 1;
    function test3(){
        var x = 2;
        console.log('inner'+x);
    }
    console.log('outer'+x);
    test3();
}
test2();
>outer1
>inner2

變數宣告會提前，賦值不會提前

function test4(){
    //相當於此處只是聲明瞭var y;
    var x='x'+y;
    var y='y';
    console.log(x);
}
test4();
>xundefined

編寫規範：將要用到的變數都提前宣告，用的時候直接賦值即可

function test5(){
    var x,y,z,...;
    //用的時候直接賦值
    x = 2;
    y=x+2;
    //...
}

全域性變數

var x = 1;
function test6(){
    console.log(x);
}
test6();
console.log(x);
>1
>1

全域性物件所有的全域性變數都是window的物件

var x = 10;
console.log(window.x);
window.console.log(x);
>10
>10

降低全域性命名衝突

//唯一全域性變數
var www={};

//定義全域性變數
www.name='www';
www.add=function(a,b){
    return a+b;
}

區域性變數 let

function pri(){
for (let i =0;i<10;i++) {
    console.log(i);//只能在此處使用
}
console.log(i+1);//Uncaught ReferenceError: i is not defined

常量 const

const PI = 3.14;
PI=3;
console.log(PI);//Uncaught TypeError: invalid assignment to const 'PI'

方法

定義

var Person={
    name:'wwww',
    birth:0000,
    age:function(){
        var now=new Date().getFullYear();
        return now-this.birth;
    }
}
Person.age();
>2021


function getAge(){
    var now=new Date().getFullYear();
    return now-this.birth;//this指的是window,window沒有birth屬性
};
var Person={
    name:'wwww',
    birth:0000,
    age:getAge
}
Person.age();//2021
getAge();//NaN

apply() 可以改變this指定的物件方法.apply(要指向的物件,此方法的引數個數)

function getAge(){
    var now=new Date().getFullYear();
    return now-this.birth;
};
var Person={
    name:'wwww',
    birth:0000,
    age:getAge
}
getAge.apply(Person,[]);
>2021