bind()方法复制函数或者方法，理解this不同作用域下的指代问题

最新推荐文章于 2019-12-04 22:04:37 发布

原创最新推荐文章于 2019-12-04 22:04:37 发布 · 404 阅读

0 ·

CC 4.0 BY-SA版权

前端开发也蛮有意思的同时被 2 个专栏收录

82 篇文章

订阅专栏

Javascript

27 篇文章

订阅专栏

本文探讨了JavaScript中this关键字的绑定规则，特别是在构造函数和原型方法中的行为。通过一个具体的示例，展示了如何使用bind方法改变函数调用时的this上下文，以确保正确引用对象实例的数据。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

要点：

1.用法：函数名(方法名).call(对象，参数1，参数2)，来复制函数或者方法的名字。

2.这个例子中，参数随机数，只在构造函数实例化的时候，创建rm实例对象时调用一次，定时器中调用的是函数的显示方法。

3.理解bind方法前后this指代不同的原因，看注释。

代码:

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<script type="text/javascript">
		function CreateRandom(){
			this.number = parseInt(Math.random() * 10 + 1);
		}
		// 

		CreateRandom.prototype.show1 = function(){
            window.setInterval(this.show2.bind(this),1000);
            // show2方法中的打印语句指代的原来是调用定时器的对象window，
            // 通过bind()方法传入的this，指代当前的调用的bind方法的CreateRandow对象
            // show2前面的this指代的是window，后面的this指代的是CreateRandow注意理解作用域

            // console.log(this);
            // 通过这句可以测试这里的this指向
		}  
		CreateRandom.prototype.show2 = function(){
			console.log(this.number);
		}

		var sr = new CreateRandom();
		sr.show1(); 

	</script>
</body>
</html>

结果;