图解 | THIS的题目

Pink
文 / 景朝霞
来源公号 / 朝霞的光影笔记
ID / zhaoxiajingjing
图 / 自己画
❥❥❥❥点个赞,让我知道你来过~❥❥❥❥

0 / THIS

找THIS的方法:

1、给元素的某个事件绑定方法,当事件触发执行的时候,方法中的this就是当前操作的元素本身

2、当方法执行时,我们看方法前面是否有【点】:没有【点】,this=>window(严格模式:undefined);有【点】,this=>点前面是谁

1 / 题目解析

本着以上两条原则来看题目

(1)请问打印几次,打印的内容是什么?

var name = 'The Window';
var obj = {
    name : 'zhaoxiajingjing',

    getNameFunc : function(){
        return function(){
            console.log(this.name);
        };
    }
};
var getName = obj.getNameFunc();

getName();
window.getName();
obj.getNameFunc()();

△ 找THIS

打印三次,打印结果是:

The Window

The Window

The Window

L13 getName()执行时,前面没有点,this=>window。打印"The Window"

L14 window.getName()执行时,前面有点,this=>点前面是window。打印"The Window"

L15 obj.getNameFunc()()打印"The Window"

公号:朝霞的光影笔记

△ 18.1_1题L15图解

L15 obj.getNameFunc()()打印"The Window"

L13和L14的this都是window,在全局作用域中声明的所有变量和函数,都成为了window对象的属性。

getName === window.getName; //=>true

(2)请问打印几次,打印的内容是什么?

var name = 'The Window';
var obj = {
    name : 'zhaoxiajingjing',

    getNameFunc : function(){
        console.log(this);
    }
};
var getName = obj.getNameFunc;

getName();
window.getName();
obj.getNameFunc();

△ 找THIS

L11 getName()方法执行,前面没有点,this=>window。打印 window

L12 window.getName()方法执行,前面有点,this=>点前面是window。打印window

L13 obj.getNameFunc() 方法执行,前面有点,this=>点前面是obj。打印 obj

这里的 L9 代码:getNameobj.getNameFunc指向的是同一个堆地址。

(3)请问打印几次,打印的内容是什么?

var name = 'The window';
var Jing = {
    name:'zhaoxiajingjing',
    show:function (){
        console.log(this.name);
    },
    wait:(function (){
        this.show();
    })()
};

Jing.wait();

△ 找THIS。哈哈,这里挖了个坑,掉下去的请自行爬上来~

ID:zhaoxiajingjing

△ 18.2_3题图解

(4)Object.prototype.toString()

有点,this=>点前面是:Object.prototype

(5)Function.prototype.__proto__.toString()

有点,this=>点前面是:Function.prototype.__proto__

(6)Object.__proto__.__proto__.toString()

有点,this=>点前面是:`Object.__proto__.__proto__

2 / 画画画图

这张图一定一定一定要自己多画几遍,这是最简版的原型和原型链的关系图。

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-aQPknY7y-1592890935122)(18.%E5%9B%BE%E8%A7%A3_THIS%E7%9A%84%E9%A2%98%E7%9B%AE.assets/18.3.png)]

△ 18.3 自己画几遍

3 / 预告

Math数学函数对象中常用的方法:

Math.max();
Math.min();
Math.ceil();
Math.floor();
Math.round();
Math.random();
....

△ Math数学函数常用的方法
ID:zhaoxiajingjing

阅读 463

朝霞的光影笔记
公号首发:朝霞的光影笔记 ID:zhaoxiajingjing →→→→ 多学一点知识,就少写一行代码

没有什么是20遍解决不了的,如果有~那就再写20遍

263 声望
13 粉丝
0 条评论

没有什么是20遍解决不了的,如果有~那就再写20遍

263 声望
13 粉丝
文章目录
宣传栏