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 相关文章推荐
ext 代码生成器
Aug 07 Javascript
js身份证判断方法支持15位和18位
Mar 18 Javascript
JS获取时间的方法
Jan 21 Javascript
js上传图片及预览功能实例分析
Apr 24 Javascript
bootstrap select下拉搜索插件使用方法详解
Nov 23 Javascript
基于vue打包后字体和图片资源失效问题的解决方法
Mar 06 Javascript
jQuery访问json文件中数据的方法示例
Jan 28 jQuery
vue实现菜单切换功能
May 08 Javascript
jquery.pager.js实现分页效果
Jul 29 jQuery
JS document内容及样式操作完整示例
Jan 14 Javascript
vue-cli3使用mock数据的方法分析
Mar 16 Javascript
WebPack工具运行原理及入门教程
Dec 02 Javascript
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
咖啡豆要不要放冰箱的原因
2021/03/04 冲泡冲煮
微信公众号点击菜单即可打开并登录微站的实现方法
2014/11/14 PHP
PHP中读取文件的几个方法总结(推荐)
2016/06/03 PHP
JS 文字符串转换unicode编码函数
2009/05/30 Javascript
Jquery Uploadify多文件上传带进度条且传递自己的参数
2013/08/28 Javascript
Jquery读取URL参数小例子
2013/08/30 Javascript
Jquery ajax基础教程
2015/11/20 Javascript
JQuery fileupload插件实现文件上传功能
2016/03/18 Javascript
JS中Array数组学习总结
2017/01/18 Javascript
简单谈谈gulp-changed插件
2017/02/21 Javascript
JavaScript DOM元素常见操作详解【添加、删除、修改等】
2018/05/09 Javascript
vue-cli项目根据线上环境分别打出测试包和生产包
2018/05/23 Javascript
Javascript三种字符串连接方式及性能比较
2019/05/28 Javascript
vue+element项目中过滤输入框特殊字符小结
2019/08/07 Javascript
vue keep-alive 动态删除组件缓存的例子
2019/11/04 Javascript
构建大型 Vue.js 项目的10条建议(小结)
2019/11/14 Javascript
浅要分析Python程序与C程序的结合使用
2015/04/07 Python
python3实现跳一跳点击跳跃
2018/01/08 Python
详谈套接字中SO_REUSEPORT和SO_REUSEADDR的区别
2018/04/28 Python
Windows下python3.6.4安装教程
2018/07/31 Python
深入浅析Python2.x和3.x版本的主要区别
2018/11/30 Python
使用python获取(宜宾市地震信息)地震信息
2019/06/20 Python
python 实现快速生成连续、随机字母列表
2019/11/28 Python
python如何快速生成时间戳
2020/07/21 Python
Python pymysql模块安装并操作过程解析
2020/10/13 Python
详解HTML5 data-* 自定义属性
2018/01/24 HTML / CSS
一家专门做特卖的网站:唯品会
2016/10/09 全球购物
Coach澳大利亚官方网站:美国著名时尚奢侈品牌
2017/05/24 全球购物
玉兰油美国官网:OLAY美国
2018/10/25 全球购物
Ariat英国官网:为世界顶级马术运动员制造最优质的鞋类和服装
2020/02/14 全球购物
建筑节能汇报材料
2014/08/22 职场文书
劳模先进事迹材料
2014/12/24 职场文书
赔偿协议书怎么写
2015/01/28 职场文书
2015年村党支部工作总结
2015/04/30 职场文书
教师节联欢会主持词
2015/07/04 职场文书
教你用Python写一个植物大战僵尸小游戏
2021/04/25 Python