이 글은 주로 JavaScript 호출 모드와 이 키워드 바인딩 간의 관계에 대한 관련 정보를 소개합니다. 필요한 친구가 참고할 수 있습니다.
호출 호출
함수를 호출하면 현재 함수의 실행이 일시 중지되고 제어가 이전됩니다. 새 함수에 대한 매개변수입니다.
실제 매개변수와 형식 매개변수 간의 불일치는 런타임 오류로 이어지지 않으며, 더 많은 매개변수는 무시되고, 더 적은 매개변수는 정의되지 않은 것으로 채워집니다.
각 메소드는 this와 인수라는 두 개의 추가 매개변수를 받습니다. 이 값은 호출 모드, 호출 모드(메서드, 함수, 생성자 및 호출 모드 적용)에 따라 다릅니다.
이 값은 값이 할당되고 호출되는 순간 발생합니다. 호출 메소드를 사용하여 다양한 호출 패턴을 구현할 수 있습니다
var myObject = { value: 0, increment: function (inc) { this.value += typeof inc === 'number' ? inc : 1; } }; myObject.double = function(){ var helper = function(){ console.log(this);// this point to window } console.log(this);// this point to object myObject helper(); } myObject.double();//myObject Window
1 메소드 호출 패턴 메소드 호출 패턴
메소드: 메소드가 호출되면 함수가 객체의 속성으로 저장됩니다. 이는 개체에 바인딩됩니다.
공용 메서드: 이
myObject.increment(); document.writeln(myObject.value); //
기본 구현: myObject.increment를 통해 개체가 속한 개체의 컨텍스트를 가져오는 메서드입니다. call(myObject, 0);
myObject.increment。call(myObject,0);
2 The Function Invocation Pattern 函数调用模式
当函数并非对象的属性时就被当作函数调用(有点废话。。),this被绑定到全局对象(window)
ECMAScript5中新增strict mode, 在这种模式中,为了尽早的暴露出问题,方便调试。this被绑定为undefined
var add = function (a,b) { return a + b;}; var sum = add(3,4);// sum的值为7
底层实现:add.call(window,3,4)
2 함수 호출 패턴 Function Invocation Pattern
함수가 객체의 속성이 아닌 경우 함수라고 합니다(좀 말도 안되는 소리지만...) , 이는 전역 개체(창)에 바인딩됩니다.
strict mode:add.call(undefined,3,4)
add.call(window, 3, 4)
function hello(thing) { console.log(this + " says hello " + thing); } person = { name: "Brendan Eich" } person.hello = hello; person.hello("world") // [object Object] says hello world 等价于 person。hello。call(person,“world”) hello("world") // "[object DOMWindow]world" 等价于 hello。call(window,“world”)
var Quo = function (string) { this.status = string; }; Quo.prototype.get_status = function ( ) { return this.status; }; var myQuo = new Quo("this is new quo"); //new容易漏写,有更优替换 myQuo.get_status( );// this is new quo
3 생성자 호출 패턴
JavaScript는 프로토타입 상속을 기반으로 하는 언어이며 클래스 기반 언어에 대한 객체 구성 구문 세트도 제공합니다.
이것은 new
apply(this,arguments[]); call(this,arg1,arg2...); var person = { name: "James Smith", hello: function(thing,thing2) { console.log(this.name + " says hello " + thing + thing2); } } person.hello.call({ name: "Jim Smith" },"world","!"); // output: "Jim Smith says hello world!" var args = ["world","!"]; person.hello.apply({ name: "Jim Smith" },args); // output: "Jim Smith says hello world!"
Function.prototype.bind = function(ctx){ var fn = this; //fn是绑定的function return function(){ fn.apply(ctx, arguments); }; }; bind用于事件中 function MyObject(element) { this.elm = element; element.addEventListener('click', this.onClick.bind(this), false); }; //this对象指向的是MyObject的实例 MyObject.prototype.onClick = function(e) { var t=this; //do something with [t]... };
위 내용은 JavaScript 호출 모드와 이 키워드 바인딩 간의 관계의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!