正文

一文搞懂this指向(代码片段)

几何心凉  几何心凉  2022-10-21  411

关键词：

前言

那你说一下 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 上，叫做显式绑定。

<script>
    var fun1= function(params) 
         console.log('我的名字是：'+this.name)
     
     var obj=
         name:'几何',
         behavior:fun1
     
     var obj1=
         name:'心凉',
     
     obj.behavior()
</script>

看到上面的代码片段大家应该可以猜到我们的打印一定是 ‘我的名字是：几何’，这个不难理解因为我们在fun1函数中的 this 指向的就是我们的函数调用者 obj 所以相当于 console.log('我的名字是：'+obj.name) ，如果我想要打印的结果为‘我的名字是：心凉’，其实我们这里只需要改变 this 的指向就可以了，让他指向 obj1

我用了三种方式去改变 this 的指向，通过打印台看出我们的三种方式都实现了效果，只是第三种的写法上多了一个 （），难闹他们就没有区别了吗？当然有区别：传参：他们的第一个参数都为 this 要绑定的对象，差距就在第二个参数了，机制：call()和apply()是立即执行函数，bind()不会立即执行函数，而是会返回一个修改过this的新函数。

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漏洞攻防技术体系的全部内容。书中还以一些典型漏洞进行扫描利
用及实战，通过漏洞扫描利用来还原攻击过程，从而可以针对性地进行防御。

写在最后

✨ $\\textcolorpink 改变能改变的，接受不能改变的！$

👍 $\\textcolorgreen点赞，你的认可是我创作的动力！$

⭐️ $\\textcolorgreen收藏，你的青睐是我努力的方向！$

✏️ $\\textcolorgreen评论，你的意见是我进步的财富！$

一文彻底搞懂python中的描述器反射(代码片段)

描述器什么是描述器？一个类中定义了如下一个或多个魔术方法，这个类的实例就是描述器：__get__，__set__，__delete__通常需要两个类来构建描述器：如果类B的类属性x，指向另一个类A的实例。被指向的A... 查看详情

一文彻底搞懂python中的描述器反射(代码片段)

一文让你搞懂javascript如何实现继承(代码片段)

一、本文想给你聊的东西包含一下几个方面：（仅限于es6之前的语法哈，因为es6里面class这关键字用上了。。）1.原型是啥？原型链是啥？2.继承的通用概念。3.Javascript实现继承的方式有哪些？二、原型是啥？原型链是啥？1.... 查看详情

一文搞懂web端登录过程(代码片段)

一文搞懂web端登录过程无状态HTTP协议session和cookiecookie（存放在客户的浏览器上）session（存放在服务器端）session和cookie的区别token登录过程token验证在了解登陆过程的原理前，应该先弄清楚几个概念无状态HTTP... 查看详情

http/https一文搞懂(代码片段)

HTTP协议（HyperTextTransferProtocol，超文本传输协议）：是一种发布和接收HTML页面的方法。HTTPS（HypertextTransferProtocoloverSecureSocketLayer）简单讲是HTTP的安全版，在HTTP下加入SSL层。SSL（S 查看详情

http/https一文搞懂(代码片段)

一文搞懂tf.function(代码片段)

朋友们，如需转载请标明出处：https://blog.csdn.net/jiangjunshow在tensorflow1.x的时候，代码默认的执行方式是graphexecution（图执行），而从tensorflow2.0开始，改为了eagerexecution（饥饿执行）查看详情

一文彻底搞懂前端沙箱(代码片段)

什么是“沙箱”沙箱（Sandbox）[1]也称作：“沙箱/沙盒/沙盘”。沙箱是一种安全机制，为运行中的程序提供隔离环境。通常是作为一些来源不可信、具破坏力或无法判定程序意图的程序提供实验之用。沙箱能够安全的执行不受信... 查看详情

一文彻底搞懂zookeeper(代码片段)

本文是基于CentOS7.9系统环境，进行Zookeeper的学习和使用1.Zookeeper简介1.1什么是ZookeeperZookeeper是一个开源的分布式的，为分布式应用提供协调服务的Apache项目。本质上，就是文件系统+通知机制1.2Zookeeper工作机制Zookeepe... 查看详情

一文彻底搞懂zookeeper(代码片段)

一文彻底搞懂slam技术(代码片段)

什么是SLAM?SLAM (simultaneouslocalizationandmapping),也称为CML(ConcurrentMappingandLocalization),即时定位与地图构建，或并发建图与定位。问题可以描述为：将一个机器人放入未知环境中的未知位置，是否有办法让机器人一边逐步描... 查看详情

一文彻底搞懂slam技术(代码片段)

一文搞懂rpc原理(代码片段)

RPC原理解析什么是RPCRPC(RemoteProcedureCallProtocol)——远程过程调用协议，它是一种通过网络从远程计算机程序上请求服务，而不需要了解底层网络技术的协议。RPC协议假定某些传输协议的存在，如TCP/IP或UDP，为通信程序之间携带信... 查看详情

一文搞懂跨域问题(代码片段)

一文搞懂跨域问题同源策略跨域解决跨域办法同源策略是浏览器的一个安全策略，保证浏览器的安全运行，要求网页中的协议名，域名和端口号要完全一致，跨域违背了同源策略就会产生跨域，比如说在百度... 查看详情

浅析js之this---一次性搞懂this指向

　　ES5函数调用三种形式：func(p1,p2)obj.child.method(p1,p2)func.call(context,p1,p2)//先不讲apply　　前两种都是语法糖，可以等价地变为call形式：转换代码func(p1, p2) 等价于func.call(undefined, p1, p2) obj.child.method(p1 查看详情

一文搞懂模型量化算法(代码片段)

1，模型量化概述1.1，模型量化优点模型量化是指将神经网络的浮点算法转换为定点。量化有一些相似的术语，低精度（Lowprecision）可能是常见的。低精度模型表示模型权重数值格式为FP16（半精度浮点）或者INT8（8位的定点整数... 查看详情

新手向：一文搞懂requestparampathvariablerequestbody(代码片段)

@PathVariable和@RequestParam一般用于Get请求，分别是从路径里面去获取变量，也就是把路径当做变量，后者是从请求里面获取参数。RequestBody一般用于Post请求，获取请求Body中的JSON数据RequestParam@ApiOperation(value&#... 查看详情

一文多图搞懂kitti数据集下载及解析(代码片段)

转载自一文多图搞懂KITTI数据集下载及解析-阿里云开发者社区KITTIDataset1.图片下载：点击下载：https://s3.eu-central-1.amazonaws.com/avg-kitti/data_object_image_2.zip2.点云下载：点击下载：https://s3.eu-central-1.amazonaws. 查看详情