继承的进阶_function person () {this

this.name = ‘jack’
}
var p = person();
console.log§//undefined
console.log(name)//jack
console.log(p.name)//'name’of undefined


上述就是去除了new方法的代码我们可以发现出现了undefined,在Javascript的new方法中this默认指向的是window。  
 然后我们对上述的代码再次进行改进  
 function person(){  
 this.name = ‘jack’;  
 return = ‘tom’;  
 }  
 var p = new person();  
 console.log§ //{ name://‘jack’}  
 console.log(p.name)//jack  
 这里要求构造函数必须是一个构造对象如果返回的不是对象还是按照new的逻辑返回新生成的对象,也就是绑定了最新的this然后再返回出来  
 所以new关键字执行之后总是会返回一个对象要么是实例对象,要么是return语句指定的对象。  
 再对call、apply、bind进行讲解  
 call、apply、bind三者是挂靠在function对象上的三个方法,所以调用这三个方法的必须是一个函数  
 具体的代码实现如下:  
 ![在这里插入图片描述](https://img-blog.csdnimg.cn/7e9b2fb9b08640beb378e42072bf357c.png)  
 这三个词的任何一个都可以改变函数func的this指向call和apply的区别在于传参的写法不同apply的第二个元素是数组而call从第二个开始就是想func的传参而band又和这两个不同虽然改变了this的指向但不是立即执行而其他两个则是改变之后立刻做出反应  
 如果还是不太懂的话我用大白话来讲一遍吧:  
 ![在这里插入图片描述](https://img-blog.csdnimg.cn/1d72e8f3bae04950944f23691c573905.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBAc2hhcnAwMDE2,size_20,color_FFFFFF,t_70,g_se,x_16)


下面我们用代码实现一下上述所讲的三个方法



let a = {
name:‘jack’,
getname:function(msg){
return msg + this.name;
}
}
let b={
name:‘lily’
}
console.log(a.getname('hello’));//hellojack
console.log(a.getname.call(b,'hi’));//hilily
console.log(a.getname.apply(b,['hi’]))//hilily
let name = a.getname.bind(b,‘hello~’);
console.log(name());//hello~lily


运行的控制台结果如下:  
 ![在这里插入图片描述](https://img-blog.csdnimg.cn/b37da3e7bbff42daad1190deb93c183b.png)


下面将会讲述一下这些方法的运用场景:理念相同都是借用方法的思路  
 在判断数据类型时:  
 ![在这里插入图片描述](https://img-blog.csdnimg.cn/c819b297af5144caa65b315922961333.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBAc2hhcnAwMDE2,size_20,color_FFFFFF,t_70,g_se,x_16)  
 类数组借用方法:  
 类数组因为不是真正的数组所有没有数组类型上自带的种种方法可以利用一些方法去借用数组的方法  
 代码实现样例:  
 ![在这里插入图片描述](https://img-blog.csdnimg.cn/35a98ca3a01d443a8e9d559a5ac11aa5.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBAc2hhcnAwMDE2,size_14,color_FFFFFF,t_70,g_se,x_16)  
 获取数组的最大最小值:  
 可以使用apply来实现,apply直接传递数组作为调用方法的参数也可以减少一步展开数组。  
 ![在这里插入图片描述](https://img-blog.csdnimg.cn/182f9ab3945841a2a2d9023a220822dc.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBAc2hhcnAwMDE2,size_12,color_FFFFFF,t_70,g_se,x_16)  
 new的实现  
 ![在这里插入图片描述](https://img-blog.csdnimg.cn/c14932997a684393ac2823eb9b5389f4.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBAc2hhcnAwMDE2,size_20,color_FFFFFF,t_70,g_se,x_16)  
 代码样例:  
 ![在这里插入图片描述](https://img-blog.csdnimg.cn/49f48f562f0748ecb65c0f34c5f2fda9.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBAc2hhcnAwMDE2,size_18,color_FFFFFF,t_70,g_se,x_16)  
 说完了new在说一下apply和call的使用方法,代码如下  
 ![在这里插入图片描述](https://img-blog.csdnimg.cn/fbb04bb44c194a9d9d05836383e1bbe8.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBAc2hhcnAwMDE2,size_16,color_FFFFFF,t_70,g_se,x_16)  
 apply和new都是直接返回结果而bind方法是返回一个函数因此这里直接用eval执行得到结果  
 bind的实现:  


### 总结

* 框架原理真的深入某一部分具体的代码和实现方式时,要多注意到细节,不要只能写出一个框架。

* 算法方面很薄弱的,最好多刷一刷,不然影响你的工资和成功率😯

* 在投递简历之前,最好通过各种渠道找到公司内部的人,先提前了解业务,也可以帮助后期优秀 offer 的决策。

* 要勇于说不,对于某些 offer 待遇不满意、业务不喜欢,应该相信自己,不要因为当下没有更好的 offer 而投降,一份工作短则一年长则 N 年,为了幸福生活要慎重选择!!!



![](https://img-blog.csdnimg.cn/img_convert/6c250b6200355d0edce85b970db267bd.png)

喜欢这篇文章文章的小伙伴们点赞+转发支持,你们的支持是我最大的动力!
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值