this的基本用法

最新推荐文章于 2024-08-22 14:32:34 发布

籽大闾

最新推荐文章于 2024-08-22 14:32:34 发布

阅读量106

点赞数

分类专栏： js基础学习文章标签： javascript 开发语言 ecmascript

本文链接：https://blog.csdn.net/qq_40371335/article/details/121045659

版权

5 篇文章 0 订阅

订阅专栏

本文探讨JavaScript中this关键字的用法，包括在对象方法中的应用，方法赋值给变量后的执行环境变化，以及如何通过bind方法解决函数上下文丢失的问题。示例展示了bind在函数绑定、参数预设及新函数创建中的作用。

摘要由CSDN通过智能技术生成

var f = function () {
  console.log(this.x);
}

var x = 1;
var obj = {
  f: f,
  x: 2,
};

// 单独执行
f() // undefined

// obj 环境执行
obj.f() // 2

上述语句中，在f使用this的情况下，单独执行时在window的环境中（注意：这里x不指向全局global）obj环境调用时输出了2，说明获得了obj环境中对x的赋值。

如果删除x前面的this.的话。f()和obj.f()均会输出1

var d = new Date();
d.getTime() // 1481869925657

var print = d.getTime;
print() // Uncaught TypeError: this is not a Date object.

在把方法赋值给变量的过程中，方法的指针会指向全局

想解决这个问题，可以使用bind(方法

var print = d.getTime.bind(d);
print() // 1481869925657

bind()方法将getTime()方法内部的this绑定到d对象

var add = function (x, y) {
  return x * this.m + y * this.n;
}

var obj = {
  m: 2,
  n: 2
};

var newAdd = add.bind(obj, 5);
newAdd(5) // 20

这里的bind不仅绑定了bind的this函数，而且给add()的x赋值为5

，然后返回一个新函数newAdd()，这个函数只要再接受一个参数y就能运行了。

关注