JS 函数与方法中this指向
程序员文章站
2022-06-28 19:08:38
首先我们要知道,函数跟方法有什么不同呢?我们平时经常使用的funciton就称为函数,如果我们把这个函数作为一个对象的属性值的时候,就称这个函数为方法。接下来我们先来看看函数与方法的this指向的区别。首先这里声明了一个对象叫obj,show为这个对象属性名,且show的属性值为一个匿名函数,因此我们把这个函数称为方法。接着我们又在这个方法里面声明了一个函数并且调用。let name = "这是window下的name"; let obj = { name: "Jok...
首先我们要知道,函数跟方法有什么不同呢?我们平时经常使用的funciton就称为函数,如果我们把这个函数作为一个对象的属性值的时候,就称这个函数为方法。
接下来我们先来看看函数与方法的this指向的区别。
首先这里声明了一个obj对象,show为这个对象属性名,且show的属性值为一个匿名函数,因此我们把这个函数称为方法。接着我们又在这个方法里面声明了一个函数并且调用。
let name = "这是window下的name";
let obj = {
name: "Joker",
show: function () {
console.log(this);
console.log(this.name); // ?
function whatName() {
console.log(this);
console.log(this.name) // ?
}
whatName()
}
};
obj.show();
那么方法里面打印的结果跟函数whatName的结果有什么不同呢?
从中我们可以看到,在方法里面的this指向的就是obj对象,而whatName函数中的this指的是window对象。
那我们应该怎么在whatName这个函数里面拿到obj对象中的属性值呢?
1. 我们可以通过将方法下面的this指向赋值给一个常量,然后在函数里面使用这个常量就能访问到外部的this了。
let name = "这是window下的name";
let obj = {
name: "Joker",
show: function () {
console.log(this);
console.log(this.name);
const that = this; //将方法里面的this指向赋值给一个常量
function whatName() {
console.log(that);
console.log(that.name)
}
whatName()
}
};
obj.show();
2.除了使用常量赋值的方法之外,我们还能使用箭头函数的方法让whatName函数获取到obj下的name。
let name = "这是window下的name";
let obj = {
name: "Joker",
show: function () {
console.log(this);
console.log(this.name);
let whatName = () => {
console.log(this);
console.log(this.name)
};
whatName()
}
};
obj.show();
tips:这里我们可以这样理解,箭头函数中的this就是指上一层中的this指向。
本文地址:https://blog.csdn.net/LttleJoker/article/details/109238515
上一篇: wps表格怎么制作九九乘法表即乘法口诀
下一篇: gulp:环境变量
推荐阅读
-
JS中find(), findIndex(), filter(), forEach(), some(), every()方法记录
-
关于python中的__init__与__new__以及__call__三个方法的简单介绍
-
JS中apply,call,bind区别与用法
-
jQuery在vs2008及js文件中的无智能提示的解决方法_jquery
-
php面向对象之构造函数作用与方法
-
分享jquery中map函数与each函数两者区别
-
php中实现xml与mysql数据相互转换的方法_php技巧
-
js如何实现设计模式中的模板方法_javascript技巧
-
JS中Date日期函数中的参数使用介绍_基础知识
-
详解PHP中的mb_detect_encoding函数使用方法_php技巧