js 的this

js的this应该是不好掌握又必须要掌握的东西

主要参考:

http://www.cnblogs.com/pssp/p/5216085.html

http://www.cnblogs.com/front-Thinking/p/4364337.html

http://www.cnblogs.com/penghuwan/archive/2017/08/14/7356210.html

这两天有点时间,将关键点整理下,做个记录:

原则1:this跟函数在哪里定义没有关系,函数在哪里调用,谁调用了,才决定this引用了哪里。

var o = { 
    user : "user", 
    fn : function(){ 
        console.log(this.user); //user 
    }
} 

o.fn();

原则2:函数中的this总是指向调用它的对象,当没有明确的调用对象时,将对函数的this默认绑定到全局的window对象。

<script lang="javascript">
function fn(){      
    console.log(this === window);
} 

fn(); // 输出true
</script>

原则3:凡是函数作为独立函数调用,无论他位置如何,他的行为表现如何,都和直接在全局环境中调用无异。

其中原则2和3是类似的,在这里牵扯了函数的作用域。

function fn(){
    var a = 1;  
    function inner(){
        console.log(this.a);
    }
    inner();
}
var a = 2;
fn();//2

特例1:当this遇到return时,如果返回值是一个对象那么this指向的就是那个返回的对象,如果返回值不是一个对象那么this还是指向函数的实例。

//-- 对象 -----------------------
function fn(){ 
    this.user = 'user'; 
    return {}; 
} 

var a = new fn(); 
console.log(a.user); //undefined

//-- 简单值 ----------------------
function fn(){ 
    this.user = 'user'; 
    return 1; 
} 

var a = new fn(); 
console.log(a.user); //user

特例2:如果传递至为简单值,那么后台会自动转换为对应的封装对象,如果传递为null,那么结果就是在绑定默认全局变量。

function fn(){
  console.log(this.a);
}

var obj = {a:2};

var a = 10;

fn.call(null);//10

  

原文地址:https://www.cnblogs.com/PPBoy/p/8151291.html