【JavaScript】this指的是谁？

ytwman 发布于2019-08-19 17:49 / 298人阅读

摘要：引用的是函数功能据以执行的环境对象，因此的值与调用函数的方式有着密切的关系。调用构造函数在调用构造函数时返回，指向构造函数创建的实例中，指向实例对象。则函数内部的指向方法指定的对象。若闭包在全局作用域中调用，则指向。

在函数创建的时候，函数内部自动获取到this（还有一个arguments）。this引用的是函数功能据以执行的环境对象，因此this的值与调用函数的方式有着密切的关系。

作为函数调用时，this指向window。

   var name = "window";
   function sayName() {
       console.log(this.name);
   }
   sayName(); //window

作为对象的方法调用时，this指向该对象。

   var obj = {
       name: "object",
       sayName: function() {
           console.log(this.name);
       }
   };
   obj.sayName(); //object
   (obj.sayName = obj.sayName)(); //window
   (obj.sayName, obj.sayName)(); //window

赋值语句和逗号运算符都会返回后面变量的值，所以后两者相当于在全局中调用了函数，this指向了window。

调用构造函数
在调用构造函数时返回this，this指向构造函数；创建的实例中，this指向实例对象。

   function Person(n) {
       console.log(this);
       this.name = n;
       this.sayName = function() {
           return this.name;
       };
   }
   var person = new Person("hiyohoo"); //Person{}
   console.log(person.sayName()); //hiyohoo

调用函数时指定this。在调用函数时如果使用函数方法call()、apply()、bind()。则函数内部的this指向方法指定的对象。而一旦被bind()指定了this值，之后不管以何种方式调用函数，其this值始终指向bind()指定的对象环境。

   var outer = {
       name: "outer",
       inner: {
           name: "inner",
           t: function() {
               return this.name;
           }
       }
   };
   console.log(outer.inner.t()); //inner
   console.log(outer.inner.t.bind(outer)()); //outer

闭包中的this。若闭包在全局作用域中调用，则this指向window。这里我们用定时器做例子：

   var name = "window";
   var obj = {
       name: "object",
       sayName: function() {
           setInterval(function() {
               console.log(this.name);
           }, 1000);
       }
   };
   obj.sayName(); //window

作为dom绑定事件的回调函数。this指向这个dom元素。

转载请注明出处：https://segmentfault.com/a/1190000004587440

文章不定期更新完善，如果能对你有一点点启发，我将不胜荣幸。

GPU云服务器云服务器指的是 html指的是 php指的是 json指的是

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/78867.html

JavaScript的创世神话——一切源于对象

摘要：但是，中并没有类的概念，而是通过构造函数替代了类的功能，为某一类的对象提供共同的属性和方法。一只名叫的狗，首先继承了构造函数的原型对象，而的原型对象中的有继承了函数的原型对象，函数对象中的有继承了的原型对象。《圣经》里的第一章创世纪中其中有一段经典记载上帝是如何创造人的。神说：我们要照着我们的形象，按照我们的样式造人。不谋而合的是，JavaScript中似乎也遵循着上帝的旨意去创造程...

enda 2019-08-22 10:50 评论0 收藏0
前端面试基本知识点——javascript

摘要：又到一年春招季，们又要奔波于一场又一场的面试。今天就先来小小总结一下方面的知识点，方便你我他。在发送请求前加上。在后面加上时间搓。这样页面的所有都会执行这条语句就是不需要保存缓存记录。如何解决跨域问题服务器上设置代理页面又到一年春招季，coder们又要奔波于一场又一场的面试。今天就先来小小总结一下javascript方面的知识点，方便你我他。随时补充 js基本数据类型 Undef...

hankkin 2019-08-20 14:47 评论0 收藏0
JS基础入门篇（四）—this的使用，模拟单选框，选项卡和复选框

摘要：建立索引，记录每一个节点值。选项卡模拟选项卡方法一大清洗，在设置颜色之前把所有的颜色值设为空。宋体选项卡一选项卡二选项卡三内容一内容二内容三方法二点击什么，清除什么。 1.this的使用 this js中的关键字 js内部已经定义好了,可以不声明直接使用 this的指向问题 1. 在函数外部使用 this指向的是window 2...

tanglijun 2019-08-22 17:14 评论0 收藏0
JS基础入门篇（四）—this的使用，模拟单选框，选项卡和复选框

摘要：建立索引，记录每一个节点值。选项卡模拟选项卡方法一大清洗，在设置颜色之前把所有的颜色值设为空。宋体选项卡一选项卡二选项卡三内容一内容二内容三方法二点击什么，清除什么。 1.this的使用 this js中的关键字 js内部已经定义好了,可以不声明直接使用 this的指向问题 1. 在函数外部使用 this指向的是window 2...

hot_pot_Leo 2019-08-29 15:23 评论0 收藏0
JS基础入门篇（四）—this的使用，模拟单选框，选项卡和复选框

摘要：建立索引，记录每一个节点值。选项卡模拟选项卡方法一大清洗，在设置颜色之前把所有的颜色值设为空。宋体选项卡一选项卡二选项卡三内容一内容二内容三方法二点击什么，清除什么。 1.this的使用 this js中的关键字 js内部已经定义好了,可以不声明直接使用 this的指向问题 1. 在函数外部使用 this指向的是window 2...

CoderDock 2019-08-02 10:26 评论0 收藏0