this 지향 총화

3250 단어
1. 대상 으로 하 는 방법 호출
this 는 이 대상 을 가리킨다
var obj = {
    a: 1,
    getA: function(){
        console.log(this===obj);// true
        console.log(this.a);//1
    }
}

obj.getA();

2. 일반 함수 로 호출
this 는 전역 대상 을 가리 키 며 브 라 우 저 js 에서 전역 대상 은 window 대상 을 가리 키 고 있 습 니 다.
window.name = 'globalName';

var getName = function(){
    console.log(this.name);//globalName
}

var obj = {
    name: 'objName',
    getName: function(){
        console.log(this.name);
    }
}

var getName2 = obj.getName;
getName2();//  globalName

3. 구조 기 호출
1. new 호출 함 수 를 사용 할 때 이 함 수 는 항상 한 대상 을 되 돌려 줍 니 다. 일반적인 상황 에서 구조 기 에 있 는 this 는 되 돌아 오 는 대상 을 가 리 킵 니 다.
var MyClass = function(){
    this.name = 'sven';
}

var obj = new MyClass();
alert(obj.name);// sven

2. 구조 기 가 object 형식 대상 을 되 돌려 주 는 것 을 표시 하면 this 가 아 닌 이 대상 을 되 돌려 줍 니 다.
var MyClass = function(){
    this.name = 'sven';
    return {
        name: 'anne'
    }
};

var obj = new MyClass();
alert(obj.name);// anne

3. 구조 기 가 데 이 터 를 되 돌려 주지 않 거나 대상 이 아 닌 데 이 터 를 되 돌려 주지 않 으 면 상기 문제 가 발생 하지 않 습 니 다.
var MyClass = function(){
    this.name = 'sven';
    rentun 'anne';
}

var obj = new MyClass();
alert(obj.name);// sven

4. Function. prototype. call 과 apply 호출
call 과 apply 는 입력 함 수 를 동적 으로 변경 할 수 있 는 this
var obj1 = {
    name: 'sven',
    getName: function(){
        return this.name;
    }
}
var obj2 = {
    name: 'anne'
}
console.log(obj1.getName());// sven
console.log(obj1.getName.apply(obj2));// anne

수정 사항
window.name = 'window';
var obj = {
    name: 'objName',
    getName: function(){
        return this.name;
    }
};
obj.getName();// objName
var c = obj.getName;
c();//window
//  
obj.getName = (function(fun){
    return function(){
        return fun.apply(obj)
    }
})(obj.getName);

obj.getName();//objName
var d = obj.getName;
d();//objName

5.apply 、call 、bind
apply(obj,[option])
call(obj,op1,op2)
bind(obj,op1,op2)
call 과 apply 는 모두 즉시 실 행 됩 니 다. bind 는 새 함수 로 돌아 갑 니 다. 즉시 실행 되 지 않 습 니 다. bind 인 자 는 bind 에서 전 달 될 수도 있 고 방법 이 호출 될 때 전 달 될 수도 있 습 니 다. 모두 concat 를 입 을 수 있 습 니 다.
var obj1 = {
    name: 'boj1',
    getName: function(p1,p2){
        return this.name+'-'+p1+'-'+p2;
    }
}
var obj2 = {
    name: 'obj2'
}

obj1.getName.apply(obj2,[1,2]);// obj2-1-2
obj1.getName.call(obj2,1,2);// obj2-1-2
var c = obj1.getName.bind(obj2,1);
c(2);// obj2-1-2

bind 실현
Function.prototype.bind = function(){ 
    var self = this, //      
        context = [].shift.call( arguments ),
        args = [].slice.call( arguments ); 
    return function(){ //         
                       //       this     //          
        return self.apply( context, [].concat.call( args, [].slice.call( arguments ) ) ); //          ,        context          this
                        //              ,        
    }
}

면접 문제http://www.cnblogs.com/xxcanghai/p/5189353.html#!comments

좋은 웹페이지 즐겨찾기