>  기사  >  웹 프론트엔드  >  js 실행 컨텍스트 변수, 함수, this

js 실행 컨텍스트 변수, 함수, this

不言
不言원래의
2018-07-05 17:25:212061검색

이 글은 주로 js 실행 컨텍스트 변수, 함수를 소개하며, 이는 특정 참조 값을 가지고 있습니다. 이제는 필요한 친구들이 참조할 수 있습니다.

#🎜🎜 # JavaScript의 실행 컨텍스트 및 호출 스택

ES6 변수 범위 및 승격: 변수의 수명 주기에 대한 자세한 설명

변수 승격

#🎜 🎜#

    변수의 정의는 코드 사전 구문 분석 중에 범위의 상단에서 정의됩니다.
  • No var 변수 없음 승격 #🎜 🎜##🎜🎜 #
  • console.log(a);  // undefined,如果没有定义会直接报错
    var a = 'aaa';
    console.log(a);  // aaa
    
    // 下面代码全等于上面代码
    var a;  // 变量提升,函数作用域范围内
    console.log(a);  // undefined
    a = 'aaa';
    console.log(a);  // aaa
    
    console.log(a);  // 直接报错
    a = 'aaa';

    함수 프로모션

함수의 정의는 코드 사전 작업 중 범위의 상단에 정의됩니다. 구문 분석

  • 함수 할당이 범위의 최상위에 있습니다

  • console.log(f1);  // f1() { console.info('函数'); }
    var f1 = function() { console.info('变量'); }
    console.log(f1);  // ƒ () { console.info('变量'); }
    function f1() { console.info('函数'); }
    console.log(f1);  // ƒ () { console.info('变量'); }
    
    // 下面代码全等于上面代码
    var f1;  // 定义提升
    function f1() { console.info('函数'); }  // 函数顶部赋值
    console.log(f1);  // f1() { console.info('函数'); }
    f1 = function() { console.info('变量'); }
    console.log(f1);  // ƒ () { console.info('变量'); }
    console.log(f1);  // ƒ () { console.info('变量'); }

    함수 컨텍스트

    # 🎜🎜#
함수의 컨텍스트는 정의될 때 결정됩니다.

  • 일반 함수 호출, 이는 창#을 가리킵니다. 🎜🎜#
    var scope = "global scope";
    function checkscope() {
      var scope = "local scope";
      function f() { return scope; }
      return f;
    }
    checkscope()();  // local scope

    메소드 호출, 이는 호출 객체를 가리킴

    // 在 function 里
    function test() {
        var type = this === window;
        return type;
    }
    test();  // true
  • 생성자 함수 호출, 이는 새로운
// 在对象里
var obj = {
    test: function() {
        var type = this === obj;
        return type;
    }
};
obj.test();  // true

// 在 prototype 对象的方法中
function obj() {
}
obj.prototype.test = function() {
    return this;
}
var o = new obj();
o.test() === o;  // true

apply/call에 의해 생성된 객체를 가리킴 call

// 调用 new 构造对象时
function obj() {
    this.test = function() {
        return this;
    }
}
var o = new obj();
o.test() === o;  // true
    dom event attribute
  • function test() {
        return this;
    }
    var o = {};
    
    // apply
    test.apply(o) === o;  // true
    
    // call
    test.call(o) === o;  // true

    위 글은 모든 분들의 공부에 도움이 되었으면 좋겠습니다. 더 많은 관련 내용은 PHP 중국어 홈페이지를 주목해주세요. !

  • 관련 추천:

JS와 JQ는 포커스 차트 캐러셀 효과를 달성합니다

#🎜 🎜 #js는 버튼을 클릭하면 편집이 가능합니다

JS에 대하여 상속 소개

위 내용은 js 실행 컨텍스트 변수, 함수, this의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.