this的用法

    在函数中this是在函数被调用执行的时候确定的，This的取值是执行上下文环境的一部分,每次调用函数,都会产生一个新的执行上下文环境.

 

1. 构造函数之this

function Foo() {

this.name = "zhangsan"; this.age = 20; console.log(this);

}

var f1 = new Foo();

 如果函数作为构造函数使用,那么其中的this就代表它new 出来的对象

 如果函数作为普通函数调用,这种情况this是指window.

function Foo() {

this.name = "zhangsan";

this.age = 20;

console.log(this);

}

Foo();

console.log(window.name);

console.log(window.age);

2. 函数作为对象的一个属性

如果函数作为对象的一个属性时,并且作为对象的一个属性被调用时,函数中的this指向该对象

//代码片段1

 var obj = {

 x:10,

 fn:function() {

 console.log(this.x);

}

};

obj.fn();

//代码片段2 var obj = {

x:10, fn:function() {

console.log(this.x);

} 

};

var obj1 = { x:20

};

obj1.fn = obj.fn; obj1.fn();

3. 函数用call或apply调用

当一个函数被call和apply调用时,this的值就去传入的对象的值

var test = "Tony"; function doSomething() {

console.log(this.test);

}

var obj = { test:"Tom"

};

doSomething();

doSomething.call(obj);//doSomething中的this指向obj

4. 全局&普通函数的调用

在全局环境下,this指向的是window对象

console.log(this === window);//true

普通函数调用时,其中的this也是指向的window对象

var x = 10;

var fn = function() {

console.log(this);//window

console.log(this.x);//10

};

fn();

注意以下情况:虽然函数f是在obj对象内部定义的,但是他任然是一个普通函数,this指向的还是window对象.

var x = 20;

var obj = {

x:10,

fn:function() {

function f() {

console.log(this);

console.log(this.x);

}

f();

}

};

obj.fn();

5. 构造函数prototype

this代表的是当前对象的值,不仅仅是在构造函数的prototype,即便是在整个原型链中.

function Fn(name, age) { this.name = name; this.age = age;

}

Fn.prototype.sayName = function() { console.log(this.name);

};

var f1 = new Fn("zhangsan", 20); console.log(f1.name);

转载于:https://www.cnblogs.com/qingshixiaodao/p/5472378.html