js的this指向之this的默认绑定

this的默认绑定

首先复习一下函数调用的四种方式

• 独立调用(函数调用模式)
• 方法调用模式：把函数保存成一个对象的属性时，该函数称为这个对象的方法
• 构造函数调用模式：用new关键字调用
• 间接调用模式：用call(),apply()进行调用

var obj = {}
function add(x,y){
	return x+y;
}
// 函数调用模式
add(1,2);
// 构造函数调用模式
var obj2 = new add(1,2);
console.log(obj2);
// 间接调用模式
add.call(obj,1,2);


var a = 0;
var obj3 = {
	a:1,
	fn:function(){
	    console.log(this.a) // 这里输出1，此处this指向涉及隐式绑定
	},
}
// 方法调用模式
obj.fn();

1.全局环境下this指向window

<script>
    console.log(this);  // window
</script>

2.函数独立调用时，函数内部的this指向window

<script>
    function fn(){
	console.log(this);  // window
    }
    // 函数模式调用
    fn();
</script>

3.被嵌套的函数独立调用时，this默认指向window

<script>
    var a = 0;
    var obj = {
        a:2,
        foo:function(){
	    // 被嵌套的函数test()
	    function test(){
                // 函数独立调用，函数内部的this指向window,window下的a=0
                console.log(this.a);    // 0
	    }
	    test();
        }
    }
	obj.foo();	
</script>

4.IIFE 自执行函数中，内部的this指向window

<script>
    var a = 10;
    function foo(){
        // 自执行函数
        (function test(){
            console.log(this.a);    // 10
        })();
    }
	var obj = {
	    a:2,
	    foo:foo
	}
	obj.foo();	
</script>

5.闭包 this默认指向window

<script>
    var a = 0;
    var obj = {
        a:2,
        foo:function(){
            return function test(){
                console.log(this);  // window
                return c;
            }
        }
    }
    obj.foo();
</script>