웹 노트 (5) - JavaScript 의 변수, 함수 와 방법

12825 단어 전단 학습 노트
변량
    JavaScript 에서 var 로 설명 하 는 변 수 는 실제 적 으로 역할 영역 이 있 습 니 다.만약 에 하나의 변수 가 함수 체 내부 에 밝 혀 지면 이 변수의 역할 도 메 인 은 전체 함수 체 이 고 함수 체 외 에서 이 변 수 를 인용 할 수 없습니다.만약 두 개의 서로 다른 함수 가 각각 같은 변 수 를 설명 한다 면 이 변 수 는 각자 의 함수 내 에서 만 작용 한다.다시 말 하면 서로 다른 함수 내부 의 동명 변 수 는 각각 독립 되 고 서로 영향 을 주지 않 는 다.
'use strict';

function foo() {
    var x = 1;
    x = x + 1;
}

function bar() {
    var x = 'A';
    x = x + 'B';
}

자 바스 크 립 트 의 함 수 는 끼 워 넣 을 수 있 기 때문에 내부 함 수 는 외부 함수 가 정의 하 는 변 수 를 방문 할 수 있 고 반대로 안 됩 니 다.
'use strict';

function foo() {
    var x = 1;
    function bar() {
        var y = x + 1; // bar    foo   x!
    }
    var z = y + 1; // ReferenceError! foo     bar   y!
}

    함수 에서 정의 되 지 않 은 변 수 는 전역 작용 역 을 가지 고 있 습 니 다. 실제로 자 바스 크 립 트 는 기본적으로 전역 대상 윈도 우 를 가지 고 있 습 니 다. 전역 작용 역 의 변 수 는 실제 윈도 우의 속성 에 연결 되 어 있 습 니 다.    JavaScript 의 변수 역할 영역 은 실제 함수 내부 이기 때문에 우 리 는 for 순환 등 구문 블록 에서 부분 적 인 역할 영역 을 가 진 변 수 를 정의 할 수 없습니다.
'use strict';

function foo() {
    for (var i=0; i<100; i++) {
        //
    }
    i += 100; //         i
}

    ES6 는 var 대신 새로운 키워드 let 를 도입 하여 블록 급 역할 영역 변 수 를 설명 할 수 있 습 니 다.
'use strict';

function foo() {
    var sum = 0;
    for (let i=0; i<100; i++) {
        sum += i;
    }
    // SyntaxError:
    i += 1;
}

함수.
(1) 함수 의 정의: JavaScript 의 함 수 는 Function 류 의 인 스 턴 스 입 니 다.함수 이름 은 참조 형식 변수 로 이 함수 대상 을 가리 키 고 있 습 니 다.그것 은 세 가지 정의 방법 이 있 습 니 다. 방법 1: 전역 변 수 를 정의 합 니 다.
function sum(num1,num2){
    return num1+num2;
}

방법 2: 글자 의 양 정의
var sum = function(num1,num2){
    return num1+num2;
}

방법 3: Function 실례
var sayHi = new Function("sName","sMessage",//       
                         "alert('hello,'+sName+sMessage);");//     
sayHi("Zhang","come here!");

주: 첫 번 째 방법 은 window 대상 의 방법 이자 변 수 를 정의 합 니 다.두 번 째 방법 과 세 번 째 방법 은 함 수 를 하나의 변수 로 직접 정의 한다.    주의해 야 할 것 은 함수 체 내부 문 구 를 실행 할 때 return 이 실 행 될 때 함수 가 실 행 됩 니 다. 그리고 결 과 를 되 돌려 줍 니 다.따라서 함수 내 부 는 조건 판단 과 순환 을 통 해 매우 복잡 한 논 리 를 실현 할 수 있다.return 구문 이 없 으 면 함수 가 실 행 된 후에 도 결 과 를 되 돌려 줍 니 다. 결 과 는 undefined 일 뿐 입 니 다.    JavaScript 는 호출 에 영향 을 주지 않 고 임의의 매개 변 수 를 입력 할 수 있 기 때문에 정 의 된 매개 변수 보다 많은 매개 변 수 를 입력 하 는 것 도 문제 가 없습니다. 함수 내부 에 이러한 매개 변 수 를 필요 로 하지 않 지만 아래 의 예 는 다음 과 같 습 니 다.
function abs(x){
    if(x >= 0){
        return x;
    }else{
        return -x;
    }
}
abs(10);//  10
abs(-9);//  9
abs();//  NaN
abs(10,'jhjhdhd');//  10

(2)arguments     자바 스 크 립 트 는 함수 내부 에서 만 작 동 하 며 현재 함수 의 호출 자가 들 어 오 는 모든 인 자 를 영원히 가리 키 는 키워드 arguments 도 있 습 니 다.그것 은 Array 와 유사 하지만, 그것 은 Array 가 아니다.arguments 를 이용 하면 호출 자가 들 어 오 는 모든 인 자 를 얻 을 수 있 습 니 다.함수 가 매개 변 수 를 정의 하지 않 아 도 매개 변수의 값 을 받 을 수 있다 는 것 이다.다음 예 와 같이:
function abs(){
    if(arguments.length == 0){
        return 0;
    }
    var x = arguments[0];//              
    return x >=0 ? x:-x;
} 

실제로 arguments 는 들 어 오 는 매개 변수의 개 수 를 판단 하 는 데 가장 많이 사용 된다. 예 를 들 어 다음 과 같다.
// foo(a[, b], c)
//   2~3   ,b     ,    2   ,b   null:
function foo(a,b,c){
    if(arguments.length == 2){
        //         a b,c undefined
        c = b; //  b  c
        b = null; // b     
     }
}
       b  “  ”  ,     arguments  ,           。

(3) rest 매개 변 수 는 다음 과 같은 예 를 보 여 줍 니 다.
function foo(a,b,...rest){
    console.log('a=' + a);
    console.log('b=' + b);
    console.log(rest);
}
foo(1,2,3,4,5);
//  :a = 1; b = 2; Array[3,4,5];
foo(1)
//  :a = 1;b = undefined; Array[]

    rest 매개 변 수 는 마지막 에 만 쓸 수 있 습 니 다. 앞에서 '...' 표 지 를 사용 합 니 다. 실행 결 과 를 보면 들 어 오 는 매개 변 수 는 a, b 를 먼저 연결 하고 나머지 매개 변 수 는 변수 rest 에 배열 형식 으로 전달 합 니 다. 들 어 오 는 매개 변 수 는 정상 적 으로 정 의 된 매개 변수 도 채 우지 않 으 면 rest 매개 변 수 는 빈 배열 을 받 습 니 다.    다음은 함수 입 니 다. 임의의 인 자 를 받 아들 여 합 을 되 돌려 줍 니 다.
function sum(...rest) {
   var sum = 0;
   for(i = 0;ireturn sum;
}

방법.
정의: 한 대상 에 함 수 를 연결 하여 이 대상 이 라 고 부 르 는 방법.다음 의 예 와 같이:
var xiaoming{
    name: 'David',
    birth: 1990,
    age: function(){
        var y = new Date().getFullYear();
        return y-this.birth;
    }
};
xiaoming.age; // function xiaoming.age()
xiaoming.age(); //      25,       26 

    위의 예 에서 this 키 워드 를 사 용 했 습 니 다. 한 방법 내부 에서 this 는 특수 변수 입 니 다. 이것 은 항상 현재 대상, 즉 xiaoming 이라는 변 수 를 가리 키 고 있 습 니 다.그래서 this. birth 는 xiaoming 의 birth 속성 을 얻 을 수 있 습 니 다.만약 JavaScript 의 함수 내부 에서 this 를 호출 했다 면, 이 this 는 도대체 누 구 를 가리 키 는 지, 상황 에 따라 정 해진 것 입 니 다.아래 의 예 와 같이:
function getAge(){
    var y = net Date().getFullYear();
    return y-this.birth;
}
var xiaoming = {
    birth: 1990,
    age: getAge
};
//  
xiaoming.age();//25     ,   this    
getAge();//NaN,   this  window

    독립 된 함수 호출 에서 strict 모드 인지 여부 에 따라 this 는 undefined 나 window 를 가리 키 지만, 우 리 는 apply 와 call 을 사용 하여 this 지향 을 제어 할 수 있 습 니 다.(1) apply 는 함수 의 this 가 어느 대상 을 가리 키 는 지 지정 하려 고 합 니 다. 함수 자체 의 apply 방법 으로 두 개의 인 자 를 받 을 수 있 습 니 다. 첫 번 째 인 자 는 바 인 딩 이 필요 한 this 변수 이 고 두 번 째 인 자 는 Array 입 니 다. 함수 자체 의 인 자 를 표시 합 니 다.예 를 들 어 다음 의 예:
function getAge(){
    var y = new Date().getFUllYear();
    return y-this.birth;
}
var xiaoming = {
    birth:1990,
    age:getAge
};
xiaoming.age();//25
getAge.apply(xiaoming,[]);//25,this  xiaoming,getAge     ,      Array   。

(2) 콜 콜 () 방법 은 apply () 방법 과 비슷 합 니 다. 유일한 차이 점 은 apply () 가 매개 변 수 를 Array 로 포장 하여 다시 전달 하 는 것 이 고 콜 () 은 매개 변 수 를 순서대로 전달 하 는 것 입 니 다.예 를 들 어 Math. max (3, 4, 5) 를 호출 하여 각각 apply () 와 call () 로 다음 과 같이 실현 합 니 다.
Math.max.apply(null,[3,4,5]);//5
Math.max.apply(null,3,4,5);//5

일반 함수 호출 에 대해 우 리 는 보통 this 를 null 로 연결 합 니 다.

좋은 웹페이지 즐겨찾기