JavaScript this 指针归纳(apply、call、bind)

Pink 发布于2019-08-26 13:47 / 2164人阅读

摘要：概述一个函数中的指向是由调用这个函数的环境来决定的。实例参数参数和一样，不同的是和在调用函数之后会立即执行，而方法调用并改变函数运行时上下文后，返回一个新的函数，供我们需要时再调用。

概述

一个函数中this的指向是由调用这个函数的环境来决定的。

全局

var a = 1;
function b(){
    var a = 2;
    console.log(this.a);
};
b(); //1



var value = 3;
function b(){
    console.log(this.value);
};
b();//3
此时的b函数的环境是全局的

局部

   var a = 1;
   var c = {a:3};
   c.b = function(){
   var a = 2;
   console.log(this.a);
   };
   c.b();//3
   
  //立即执行函数 由于是赋值，所以只执行了右边的函数
  var a = 1;
  var c = {a:3};
  (c.b = function(){
  var a = 2;
  console.log(this.a);
  })();//1

apply、call 和 bind 改变this指向

apply

参数

只能传两个参数，第一个参数a是改变this指向的结果对象(在非严格模式下，第一个参数为null或者undefined时会自动替换为指向全局对象)，第二个参数是传给a的参数集合（arguments[数组或类数组]）；

实例

var a = 1;
var c = {a : 3};
function b(d,e){
    var a = 2;
    console.log(this.a);
    console.log(d,e);
};
b.apply(c);//3  undefined undefined
b.apply();//1  undefined undefined
b.apply(c,[5,6]);// 3  5 6

call

参数

第一个参数和apply()的第一个参数一样，不同的是apply()后面是接收一个数组或类数组，call()后面是是接收的参数列表。

实例

var a = 1;
var c = {a : 3};
function b(d,e){
    var a = 2;
    console.log(this.a);
    console.log(d,e);
};
b.call(c);//3  undefined undefined
b.call();//1  undefined undefined
b.call(c,5,6);// 3  5 6

bind

参数

参数和call一样，不同的是 call()和apply()在调用函数之后会立即执行，而bind()方法调用并改变函数运行时上下文后，返回一个新的函数，供我们需要时再调用。

实例

var a = 1;
var c = {a : 3};
function b(d,e){
   var a = 2;
   console.log(this.a);
   console.log(d,e);
};
var b1 = b.bind(c);
var b2 =b.bind();
var b3 =b.bind(c,5,6);
b1();//3  undefined undefined
b2();//1  undefined undefined
b3()// 3  5 6

GPU云服务器云服务器 JS中bind、call和apply的作 apply与call的区别 js中的call和apply this指针

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

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

JavaScript函数（二）

摘要：目录函数的声明函数的属性和方法函数的作用域闭包知识点小结关于函数，可以从以下个方面去理解首先，数据类型上看函数在中是一种数据类型，是对象的一种其次，从功能上看函数本质上是一段反复调用的代码块最后，从地位上看函数在中和其他基本数据类型一样，可目录 1.函数的声明 2.函数的属性和方法 3.函数的作用域 4.闭包知识点 5.小结关于函数，可以从以下3个方面去理解：首先，数据类型上看：...

用户84 2019-08-21 11:20 评论0 收藏0
js函数this理解？手写apply、call、bind就够了

摘要：一是什么函数的内部属性，引用的是函数据以执行的环境对象。函数做为节点事件调用时指向节点本身做为构造函数实力化方法时指向实例对象箭头函数里的普通函数，由于闭包函数是执行的，所以指向箭头函数的指向函数创建时的作用域。一、this是什么？函数的内部属性，this引用的是函数据以执行的环境对象。也就是说函数的this会指向调用函数的执行环境。 function a(){ retur...

Cciradih 2019-08-26 10:39 评论0 收藏0
JavaScript函数的call，apply和bind

摘要：它们有明确的和成员函数的定义，只有的实例才能调用这个的成员函数。用和调用函数里用和来指定函数调用的，即指针的指向。同样，对于一个后的函数使用或者，也无法改变它的执行，原理和上面是一样的。函数里的this指针要理解call，apply和bind，那得先知道JavaScript里的this指针。JavaScript里任何函数的执行都有一个上下文（context），也就是JavaScri...

alighters 2019-08-22 14:48 评论0 收藏0
关于this的知识归纳(通俗易懂版)

摘要：于是决定写个归纳。如果懂了，那么下面的例子也就会做了已知调用函数的对象是，所以指向，即。相当于在全局作用域声明了变量，并且赋值。实际上，调用函数的是关键字。使用来调用函数，即函数的构造调用时，我们会构造一个新对象，并把它绑定到调用中的上。对this的理解，我一直都是用一句话概括：谁调用它，它就指向谁。好像也没有什么问题，但仔细看了这本书和网上一些文章后，发现this的原理还挺讲究的...

enda 2019-08-20 16:30 评论0 收藏0
javascript：this 关键字

摘要：执行完以后，将该匿名函数赋值给。上述代码其实等价于执行如下的代码，函数回调场景基本原理可以看到，把一个定义有关键字的函数作为其它函数的回调函数，是危险的，因为在运行期会被重新赋值，上述例子很直观的描述了这一点，之所以报错，是因为指向了。前言看过[阮一峰]()的关于 this 的教程，讲了很多比较好的例子，但没有对其本质的东西解释清楚，而且部分例证存在问题；于是，打算重写本章节，从t...

shixinzhang 2019-08-26 11:44 评论0 收藏0