javascript的this

2016-08-17  本文已影响20人  进击的前端

关于this

其实this就是当前绑定的方法的对象,如果没有定义,那么就是global,如果是严格模式下,那么就是undefined

面试官问到一道this的题目没有做出来,想必也是半懂不懂吧

var a = {
    "course":"English",
    "teach":function () {
        function print() {
            return "teach " + this.course;
        }
        return print();
    }
}
console.log(a.teach())

如果是a.teach里面有this的话,那么就是指代a这个对象,如果是print的话,print本身并没有绑定对象,那么在要么global,要么undefined,取决于是否为严格模式。
这道题的答案其实很简单,不过当时对this的这个坑,跳得还是太多了,简单地总结一下,this指代的是对象(好吧当年这么简单的坑竟然也没挖好)

简单调用

非严格模式下,简单调用是global对象

function f1(){
  return this;
}
f1() === window; // global object

严格模式下,是undefined

function f2(){
  "use strict"; // see strict mode
  return this;
}
f2() === undefined;

也就是说,函数如果不作为方法或者对象的属性来调用的话,那么就是undefined

Arrow functions[ES6]

...

作为对象的方法

var o = {
  prop: 37,
  f: function() {
    return this.prop;
  }
};
console.log(o.f()); // logs 37

当然作为动态绑定也是可以的

var o = {prop: 37};
function independent() {
  return this.prop;
}
o.f = independent;
console.log(o.f()); // logs 37

原型链中的作用

var o = {f:function(){ return this.a + this.b; }};
var p = Object.create(o);
p.a = 1;
p.b = 4;

console.log(p.f()); // 5

this指代调用的object

getter和setter

function sum(){
  return this.a + this.b + this.c;
}

var o = {
  a: 1,
  b: 2,
  c: 3,
  get average(){
    return (this.a + this.b + this.c) / 3;
  }
};

Object.defineProperty(o, 'sum', {
    get: sum, enumerable:true, configurable:true});

console.log(o.average, o.sum); // logs 2, 6

其实这几条,都可以理解为函数执行的时候绑定的对象

作为构造器

function C(){
  this.a = 37;
}

var o = new C();
console.log(o.a); // logs 37


function C2(){
  this.a = 37;
  return {a:38};
}

o = new C2();
console.log(o.a); // logs 38

其实也是可以理解为new的过程,就是以返回原型构造的一个方法。

上一篇下一篇

猜你喜欢

热点阅读