详解JavaScript原型对象的this指向问题
更新时间：2021年11月18日 10:07:31 作者：bear*6
这篇文章主要为大家介绍了JavaScript原型对象的this指向问题，具有一定的参考价值，感兴趣的小伙伴们可以参考一下，希望能够给你带来帮助
一、this指向
构造函数中的this 指向实例对象。那么原型对象this的指向呢？
如下：
function Student(age,name){
this.age = age;
this.name = name;
}
var that;
Student.prototype.score = function(){
console.log('孩子们成绩都很好！');
that = this;
}
var xl = new Student(18,'小熊');
xl.score();
console.log(that === xl);
定义一个全局变量that,在score函数里面给它赋值，让其指向函数里面的this,调用实例对象的score方法，判断that和实例对象是否一致，如果一致，则说明原型对象this的指向是该实例。
打印结果为：
即原型对象里面放的是方法, 这个方法里面的this 指向的是 这个方法的调用者, 也就是这个实例对象。
二、修改this指向
1、call()方法
写一个简单的两数相加的函数。
function fn(a,b){
console.log(a+b);
console.log(this);
}
fn(1,2)
在函数内部打印this，调用函数，看其this的指向。
可知this指向window对象，如果我们想让this指向我们新创建的一个对象，怎么操作呢？
先定义一个对象，
o = {};
然后通过call()修改this指向，让其指向新创建的对象o
o = {
name: 'xl'
};
fn.call(o,1,2);
打印结果为：
现在this指向新创建的对象o，即修改成功。
2、apply()方法
apply（）和call()方法基本相同，这里就不赘述，直接上代码：
function fn(a,b){
console.log(a+b);
console.log(this);
}
o = {
name: 'xl'
};
fn.apply(o,[1,2]);
可以发现，这两种方法还是有区别的，即：call()接受的参数必须是连续参数，而apply()方法接收参数的形式是数组参数。
总结
本篇文章就到这里了，希望能够给你带来帮助，也希望您能够多多关注脚本之家的更多内容!
相关文章
小程序可以通过微信官方提供的登录方法方便地获取微信提供的用户身份标识,进而开发者可以进行下一步操作,下面这篇文章主要给大家介绍了关于微信小程序开发之获取用户信息的两种方法,需要的朋友可以参考下2022-03-03
JavaScript中click和onclick本质区别与用法分析
这篇文章主要介绍了JavaScript中click和onclick本质区别与用法,结合实例形式分析了JavaScript中click和onclick的具体概念、功能、使用场景及相关操作技巧,需要的朋友可以参考下2018-06-06
本文通过代码给大家总结了常见的响应式布局media的使用方法，感兴趣的朋友参考下吧2017-08-08
这篇文章主要介绍了ES6学习笔记之正则表达式和字符串正则方法,结合实例形式对比分析了ES5与ES6正则操作的常用函数功能与用法区别,需要的朋友可以参考下2017-04-04
这篇文章主要介绍了JS常用跨域方法实现原理解析,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2020-12-12
本文主要介绍了JavaScript 显示一个倒计时广告牌的实现示例，文中通过示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-04-04
这篇文章主要为大家详细介绍了微信小程序websocket实现即时聊天功能，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2019-05-05
本文给大家分享javascript脚本库编写的方法，涉及到javascript脚本相关知识，对javascript脚本相关知识感兴趣的朋友一起学习吧2015-12-12
这篇文章主要介绍了JS数组array元素的添加和删除方法代码实例,本文直接给出操作代码实例,需要的朋友可以参考下2015-06-06
这篇文章主要介绍了VSCODE中配置JavaScript编译环境的方法，方式一 使用Node.js做为解释器运行JS代码 Node.js的安装和配置，方式二使用VSCODE插件Code Runner运行JS代码，本文给大家介绍的非常详细，需要的朋友可以参考下2022-08-08
最新评论