前言
那你说一下 js 中的 this 指向吧!这句话已经成为面试官口中的高频面试题,作为前端开发的我们,你真的搞懂了 this 指向了吗?快来跟我一起来查漏补缺吧!通过几个小案例让大家更能直白的理解 this 指向。
很多前端伙伴问题有没有体系的面试题?
今天为大家推荐一款刷题神奇哦 点击链接访问牛客网
各大互联网大厂面试真题。从基础到入阶乃至原理刨析类面试题 应有尽有,赶快来装备自己吧!助你面试稳操胜券,solo全场面试官
this 指向
默认window
首先来说我们的 this 指向默认是指向的 window


new 绑定
如果函数或者方法调用之前带有关键字 new,会构造一个新对象并把它绑定到所调用函数的this上。称为 new 绑定


箭头函数
箭头函数就比较特殊了,他没有明确的指向,他里面的 this 其实是根据他的上级来定的,也就是他的 this 指向等于他的上级。


隐形绑定
大家应该根据字面意思猜测到,其实就是我们没有通过代码去绑定 this 的指向,但是我们的 this 也被秘密的绑定到了某个地方


大家可以看出我们通过obj.behavior()调用了 fun1 函数 打印的 this 其实是我们函数的调用者 obj
显式绑定
大家也是能够从字面意思看明白,就是我们通过代码的方式去绑定,通过 call()、apply()、bind()方法把对象绑定到 this 上,叫做显式绑定。
- [/code] 看到上面的代码片段大家应该可以猜到我们的打印一定是 ‘我的名字是:几何’,这个不难理解因为我们在fun1函数中的 this 指向的就是我们的函数调用者 obj 所以相当于 console.log('我的名字是:'+obj.name) ,如果我想要打印的结果为‘我的名字是:心凉’,其实我们这里只需要改变 this 的指向就可以了,让他指向 obj1
- [img]https://img-blog.csdnimg.cn/c8d7e4f58a4b442793ec6eab710eecb2.png[/img]
- [img]https://img-blog.csdnimg.cn/b8a4513e73814a70b2ec47812871402f.png[/img]
- 我用了三种方式去改变 this 的指向,通过打印台看出我们的三种方式都实现了效果,只是第三种的写法上多了一个 (),[color=pink]难闹他们就没有区别了吗?当然有区别:传参:他们的第一个参数都为 this 要绑定的对象,差距就在第二个参数了,机制:call()和apply()是立即执行函数,bind()不会立即执行函数,而是会返回一个修改过this的新函数。[/color]
- <font color="pink"> [code]obj.behavior.call(obj1,22,'北京')//我的名字是:心凉,我今年22岁,我现在在北京
- obj.behavior.apply(obj1,[22,'北京'])//我的名字是:心凉,我今年22岁,我现在在北京
- obj.behavior.bind(obj1,22,'北京')()//我的名字是:心凉,我今年22岁,我现在在北京
复制代码 很多前端伙伴问题有没有体系的面试题?
今天为大家推荐一款刷题神奇哦 点击链接访问牛客网
各大互联网大厂面试真题。从基础到入阶乃至原理刨析类面试题 应有尽有,赶快来装备自己吧!助你面试稳操胜券,solo全场面试官
本期图书推荐
过去网络安全距离我们很远,只要没有被攻击便可以忽略,而现在如果存在安全漏洞且一不小心被成功攻击,就可能导致很多公司财务等重要数据被勒索病毒感染,造成巨大经济损失!近几年来,国家展开了护网行动,加上各种机构经常组织CTF比赛等,网络安全越来越火,人才缺口也越来越大。“会渗透,是懂安全的基础;会漏扫,是懂渗透的基础;去实战,是检验能力的标准”此书可以给网络安全领域的专业人士或想入门的人士答疑解惑,是您必不可少的一本专业图书!

本书从网络攻防实战的角度,对Web漏洞扫描利用及防御进行全面系统的研究,由浅入深地介绍了在渗透过程中如何对Web漏洞进行扫描、利用分析及防御,以及在漏洞扫描及利用过程中需要了解和掌握的基础技术。
全书共分10章,包括漏洞扫描必备基础知识、域名信息收集、端口扫描、指纹信息收集与目录扫描、Web漏洞扫
描、Web常见漏洞分析与利用、密码扫描及暴力破解、手工代码审计利用与漏洞挖掘、自动化的漏洞挖掘和利用、Web漏洞扫描安全防御,基本涵盖了Web漏洞攻防技术体系的全部内容。书中还以一些典型漏洞进行扫描利
用及实战,通过漏洞扫描利用来还原攻击过程,从而可以针对性地进行防御。
写在最后
✨ 改 变 能 改 变 的 , 接 受 不 能 改 变 的 ! \textcolor{pink}{ 改变能改变的,接受不能改变的!} 改变能改变的,接受不能改变的!
免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作! |