前端笔试题总结（this指向问题）

var x = 3;
var y = 4;
var obj = {
    x: 1,
    y: 6,
    getX: function() {
        var x =5;
        return function() {
            return this.x;
        }();
    },
    getY: function() {
        var y =7;
         return this.y;
    }
}
console.log(obj.getX())//3
console.log(obj.getY())//6

this指向问题分为四种

1.函数调用模式中this指向window。如题中obj.getX()返回的是一个立即执行函数，而这个函数的调用者就是window

2.方法调用模式中this指向调用对象。如题中的obj.getY()

3.构造函数调用模式，this指向new出来的对象,也就是实例对象。

function A(){this.name="yy1"}
var a = new A();
console.log(a.name)

4.上下文调用模式，可以指定this的作用域。当第一个参数是null或者undefined时，this指向window。

apply()和call()

fn.apply(作用域,[...args])

fn.call(作用域,arg1,arg2,arg3...)

    function Woman(name){
        this.name=name;
    }
    function Man(name){
        this.name="yy1";
    }
    Object.defineProperty(Woman,"name",{
        configurable:true,//能否使用delete、能否需改属性特性、或能否修改访问器属性、，false为不可重新定义，默认值为true
        enumerable:false,//对象属性是否可通过for-in循环，flase为不可循环，默认值为true
        //writable:false,对象属性是否可修改,flase为不可修改，默认值为true
        //value:'njso' 对象属性的默认值，默认值为undefined
        set:function() {
            name="yy2";
        },
        get:function(){
            return "yy3"
        }
    })
    Woman.prototype = new Man();
    var a = new Woman();
    var b = new Man();
    console.log(Woman.name)//yy3，获取Woman的静态属性，调用了get方法
    console.log(a.name)//undefined,因为没有给this.name赋值，
    //如果注释this.name = name ;则返回yy1.
    //用点语法访问属性和方法时，会首先在对象自己内部查找，如果找到了就直接只用，
    //如果没有找到才去原型中查找，如果原型中也没有的话属性会Undefined，方法会报错。
    console.log(b.name)//yy1，构造方法模式，this指向实例对象

注意：点语法赋值时，如果对象没有该属性，就会给对象新增该属性并赋值，如果有该属性则是修改属性值，而不会修改原型中的东西。

前端笔试题总结（this指向问题）

猜你喜欢