JS ES6中setTimeout函数的执行上下文示例


Posted in Javascript onApril 27, 2017

本文介绍的是setTimeout函数,延迟执行函数里的执行上下文,分享给大家供大家参考学习,来看看详细的内容:

(1)ES5中,setTimeout里面的函数的执行上下文为全局上下文,举例来说:

function log(){
 setTimeout(function(){console.log(this.id)},100)
}
var id=42
log.call({id:21})

//输出的结果为42

我们可以看到setTimeout,被延迟执行的函数,里面的this,指向的是全局作用域,也就是这个函数的上下文为全局上下文。

(2)在ES6的箭头函数中,setTimeout里面,如果执行了一个箭头函数,那么这个函数的执行上下文为定义这个箭头函数所在的函数。

function log(){
 setTimeout(()=>{
  console.log(this.id)
 },100)
}
var id=42;
log.call({id:21})

//这次输出的是21

总结:

因为ES6中,箭头函数的this,规定的指向定义这个箭头函数所在的那个函数。于是这里箭头函数里面的this,就固定bind了{id:21}。

好了,以上就是这篇文章的全部内容了,希望本文的内容对大家学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
JavaScript的parseInt 进制问题
May 07 Javascript
jquery1.4后 jqDrag 拖动 不可用
Feb 06 Javascript
JS在IE和FireFox之间常用函数的区别小结
Mar 12 Javascript
Jquery动态更改一张位图的src与Attr的使用
Jul 31 Javascript
JavaScript中的函数嵌套使用
Jun 04 Javascript
JQuery EasyUI Layout 在from布局自适应窗口大小的实现方法
May 28 Javascript
ionic组件ion-tabs选项卡切换效果实例
Aug 27 Javascript
BackBone及其实例探究_动力节点Java学院整理
Jul 14 Javascript
vue2.0项目实现路由跳转的方法详解
Jun 21 Javascript
微信小程序云开发之模拟后台增删改查
May 16 Javascript
vue中渲染对象中属性时显示未定义的解决
Jul 31 Javascript
vue如何清除浏览器历史栈
May 25 Vue.js
Vue实现购物车功能
Apr 27 #Javascript
js轮播图透明度切换(带上下页和底部圆点切换)
Apr 27 #Javascript
Angular.js中定时器循环的3种方法总结
Apr 27 #Javascript
浅谈js使用in和hasOwnProperty获取对象属性的区别
Apr 27 #Javascript
微信小程序 wx:for的使用实例详解
Apr 27 #Javascript
微信小程序 动态传参实例详解
Apr 27 #Javascript
微信小程序 本地数据读取实例
Apr 27 #Javascript
You might like
php数据入库前清理 注意php intval与mysql的int取值范围不同
2010/12/12 PHP
Discuz!X中SESSION机制实例详解
2015/09/23 PHP
PHP接口并发测试的方法(推荐)
2016/12/15 PHP
thinkphp框架类库扩展操作示例
2019/11/26 PHP
php设计模式之原型模式分析【星际争霸游戏案例】
2020/03/23 PHP
运用Windows XP附带的Msicuu.exe、Msizap.exe来彻底卸载顽固程序
2007/04/21 Javascript
suggestion开发小结以及对键盘事件的总结(针对中文输入法状态)
2011/12/20 Javascript
javascript if条件判断方法小结
2014/05/17 Javascript
jQuery将多条数据插入模态框的示例代码
2014/09/25 Javascript
JavaScript使用function定义对象并调用的方法
2015/03/23 Javascript
javascript实现行拖动的方法
2015/05/27 Javascript
跟我学习javascript的undefined与null
2015/11/17 Javascript
jquery zTree异步加载、模糊搜索简单实例分享
2016/03/24 Javascript
使用vue.js实现checkbox的全选和多个的删除功能
2017/02/17 Javascript
angular4中关于表单的校验示例
2017/10/16 Javascript
Angular 实现输入框中显示文章标签的实例代码
2018/11/07 Javascript
vue v-for 使用问题整理小结
2019/08/04 Javascript
node.js使用 http-proxy 创建代理服务器操作示例
2020/02/10 Javascript
js实现时钟定时器
2020/03/26 Javascript
vue 动态给每个页面添加title、关键词和描述的方法
2020/08/28 Javascript
H5+css3+js搭建带验证码的登录页面
2020/10/11 Javascript
python 函数传参之传值还是传引用的分析
2017/09/07 Python
python 巧用正则寻找字符串中的特定字符的位置方法
2018/05/02 Python
python实现可变变量名方法详解
2019/07/01 Python
Python多线程threading创建及使用方法解析
2020/06/17 Python
用python批量下载apk
2020/12/29 Python
HTML5之web workers_动力节点Java学院整理
2017/07/17 HTML / CSS
HTML5+css3:3D旋转木马效果相册
2017/01/03 HTML / CSS
GANT葡萄牙官方商店:拥有美国运动服传统的生活方式品牌
2018/10/18 全球购物
应届生自荐信范文
2014/02/21 职场文书
校园安全演讲稿
2014/05/09 职场文书
购房公证委托书(2014版)
2014/09/12 职场文书
公务员年度个人总结
2015/02/12 职场文书
部门2015年度工作总结
2015/04/29 职场文书
教你利用python实现企业微信发送消息
2021/05/23 Python
vue使用localStorage持久性存储实现评论列表
2022/04/14 Vue.js