(1)、call方法

1、call()方法可以进行普通函数的调用

2、call()方法可以改变this的指向,如果没有参数,this指向window

3、call()方法可以改变this的指向,如果有一个参数,this指向该参数

4、call()方法可以改变this的指向,如果有多个参数,this指向第一个参数,剩下的是个参数列表(构造函数继承的案例)

(2)、apply方法

1、 apply()方法可以进行普通函数的调用

2、apply()方法可以改变this的指向,如果没有参数,this指向window

3、apply()方法可以改变this的指向,如果有一个参数,this指向该参数

4、apply()方法可以改变this的指向,如果有多个参数,第一个参数是null或者window,第二个参数是数组

(3)、bind方法

推荐使用第二种形式,第三种用的相对较少,但也是必须掌握的内容。

bind() 函数会创建一个新函数(称为绑定函数),新函数与被调函数(绑定函数的目标函数)具有相同的函数体(在 ECMAScript 5 规范中内置的call属性)。当目标函数被调用时 this 值绑定到 bind() 的第一个参数,该参数不能被重写。绑定函数被调用时,bind() 也接受预设的参数提供给原函数。一个绑定函数也能使用new操作符创建对象:这种行为就像把原函数当成构造器。提供的 this 值被忽略,同时调用时的参数被提供给模拟函数。

  1. bind()不能进行函数的调用
  2. 可以改变this指向
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body></body><script>// 1、var fn1 = function () {console.log("我是函数表达式");}// fn1();fn1.call();var name = "小红";var obj1 = {name: "小花",getName: function () {console.log(1111);console.log(this.name);}.bind()}obj1.getName();/*   obj1.getName();//小花obj1.getName.call();//小红 */var obj2 = {name: "小刚",getName: function () {console.log(this.name);}}obj2.getName();obj2.getName.call();obj2.getName.call(obj1); //小花// 2、fn1.apply()obj1.getName.apply(); //小红obj2.getName.apply(obj1); //小花console.log(Math.max(20, 30, 50)); //50console.log(Math.max.call(window, 20, 30, 50)); //50console.log(Math.max.apply(Window, [20, 30, 50])); //50console.log(Math.max.apply(null, [20, 30, 50])); //50// 3、// fn1.bind();var fn2 = function () {console.log(22222222222222);console.log(this.name); //小红 小花console.log("bind调用");}.bind()// .bind(obj1)fn2()// fn2.bind();var name = "喜羊羊";var object = {name: "懒洋洋",getName: function () {var name = "美羊羊";var that = this;console.log(this.name); //懒羊羊console.log(name); //喜羊羊 美羊羊function func1() {console.log(this.name); //喜羊羊console.log(name); //美羊羊 undefined// var name = "村长羊";}func1();var name = "暖羊羊"var name = function () {console.log(name); //f name()console.log(this.name);}name();var func2 = function () {console.log("999999999999999999999999999999");console.log(name);console.log(this.name); //喜羊羊 懒羊羊// }.bind(this)return name;// console.log(this.name); }.bind(that)console.log(func2());func2.call(this);}}// }object.getName();
</script></html>

改变this指向的方法相关推荐

  1. JavaScript基础--改变this指向的方法

    1. this指向 this随处可见,一般谁调用,this就指向谁.this在不同环境下,不同作用下,表现的也不同. 以下几种情况,this都是指向window的: ① 全局作用下,this指向的是w ...

  2. this指向及改变this指向的方法

    原先总结过this指向问题,但看了大佬们写的之后,觉得自己遗漏了很多点,所以,结合大佬们的,重写一遍 一.函数的调用方式决定了 this 的指向不同: 1.普通函数调用,此时 this 指向 wind ...

  3. 前端改变this指向的方法有哪些?如何判断this指向?

    bind.call.apply.箭头函数.new.这些都可以改变this指向,他们之间的区别是 1.call 和 apply 的this指向 call 和 apply其实是一样的,区别在于传参的时候参 ...

  4. this指向和改变其指向的方法

    this笔记(仅作为个人学习使用) 一.this 的指向 在 ES5 中,其实 this 的指向,始终坚持一个原理:this 永远指向最后调用它的那个对象. 下面这个例子,这里的 a() 是被wind ...

  5. this指向和如何改变this指向 (详解)

    注:颜色标识为重要字眼.  目录:-this详解            -改变this指向的方法 一.this概述 它是JS的关键词,是一个代词"指代不明",需要代码执行过程中根据 ...

  6. 作用域和改变this指向

    1,作用域和自由变量 作用域代表了一个变量的合法范围,一个变量的作用域是程序源代码中定义的这个变量的区域. 1,全局作用域 不在任何函数内声明的变量(函数内省略var的也算全局)称作全局变量 就是在最 ...

  7. 改变this指向的操作

    改变this指向的方法 之前已近介绍过this指向的情况,其实this的指向是可以改变的,有些人就会好奇,那怎么样改变this的指向呢? 其实改变this的指向,有三种比较常用的方法. 1:call( ...

  8. 箭头函数 改变this指向

    1.箭头函数 <div>我是div</div><script>const oDiv = document.querySelector('div');// 普通函数o ...

  9. js 改变this指向的几种方法(个人学习笔记)

    1.call()和apply() 两中方法都能改变this指向,很类似,区别主要是第二个以后参数, call():第一个参数表示要把this指向的新目标,第二个之后的参数其实相当于传参,参数以,隔开  ...

  10. javaScript改变this指向的三种方法

    javaScript提供了一些函数方法帮助我们处理函数内部this的指向问题,常用的有bind().call().apply()三种方法 1.call() 方法调用一个对象.简单理解为调用函数的方式, ...

最新文章

  1. 除了数据还是数据?2018年5大 AI (人工智能)预测
  2. rtmp协议封装h264与h265打包flv发送
  3. 计算机网断IP修改,修改计算机名、IP
  4. LeetCode 834. 树中距离之和(树上DP)*
  5. 2017 ACM暑期多校联合训练 - Team 3 1008 HDU 6063 RXD and math (莫比乌斯函数)...
  6. 2019-06-19 阿里巴巴三面
  7. 全国医疗机构勒索病毒事件公告:阿里云发布公益行动
  8. linux 软件装哪个目录下,Linux查看软件安装目录及位置 方法
  9. 用计算机思维认识摩斯密码(摩斯密码速记)
  10. Autodesk AutoCAD 2018 for mac
  11. 封装解决WebView的那些坑
  12. MySQL复制之gtid_purged与gtid_executed
  13. MySQL 按照天数查询数据
  14. RK系列开发板音频驱动适配指南(二)
  15. Java课程设计——仓库商品管理系统
  16. 为视图或函数指定的列名比其定义中的列多
  17. MarkDown语法详解
  18. 各种分布(distribution)
  19. Google 手机地图-中国版~
  20. 服务器阵列工作原理,阵列卡的工作原理

热门文章

  1. 打开MPP格式文件的十种方法
  2. 2007左右美国程序员工资大概样子
  3. vue二维码的批量生成及下载
  4. 你所不知道的互联网那些职业-技术岗
  5. 软件工程 实验3 数据流图和实体联系图的绘制
  6. 为什么电脑桌面无计算机图标,我的电脑桌面图标都没名字了为什么
  7. 江苏省计算机一级考试难度,浅谈江苏省计算机等级考试(一级除外)
  8. 小游戏开发设计之塔防类游戏
  9. gif动图怎么制作?手把手教你视频转gif动图
  10. ansys轴对称模型之二维模型