关于JS的改变this指向的三个方法【call,apply,bind】的简单理解
2023-09-11 14:19:18 时间
关于JS的改变this指向的三个方法【call,apply,bind】做一个个人的简单理解
前言: JS中改变this指向的三个方法,基本都是清楚的,但是在使用上面,看了部分博文,感觉都讲的有些高深莫测了,自己试着做了了一个相对简单的demo,理解上应该是很简单的。基本的使用方法代码注释上都做了说明
语法:
function.call ( object , [values] )
function.apply ( object , [array] )
function.bind ( object , [values] ) ()
**[ ]**表示可选参数,object表示函数要绑定this的指定对象,values表示是需要传入函数的参数,array表示需要传入的是一个数组(数组内也是函数的参数)
示例:
function say(arg1,arg2){
console.log(this.name,arg1,arg2);
};
var obj = {
name : 'tom',
}
say('one','two')
//输出:undefined one two ,未绑定this指向,this指向的是全局,全局没有name,因此undefined
say.call(obj,'one','two');//tom one two
// call的使用方法,第一个参数为需要绑定的对象,后面的参数是当前函数需要传入的参数
say.apply(obj,['one','two']);//tom one two
// apply使用方法大致和call相同,但是第二个参数是一个数组,需要对数组二次解析,因此从中可以得出apply的效率没有call的高
say.bind(obj,'one','two')() //tom one two
// bind的使用方法传入参数和call差不多,但是bind调用后返回的是一个函数,需要再次调用返回的函数才能有输出
相关文章
- html table表格导出excel的方法 html5 table导出Excel HTML用JS导出Excel的五种方法 html中table导出Excel 前端开发 将table内容导出到excel HTML table导出到Excel中的解决办法 js实现table导出Excel,保留table样式
- 服务器文档下载zip格式 SQL Server SQL分页查询 C#过滤html标签 EF 延时加载与死锁 在JS方法中返回多个值的三种方法(转载) IEnumerable,ICollection,IList接口问题 不吹不擂,你想要的Python面试都在这里了【315+道题】 基于mvc三层架构和ajax技术实现最简单的文件上传 事件管理
- js中对arry数组的各种操作小结 瀑布流AJAX无刷新加载数据列表--当页面滚动到Id时再继续加载数据 web前端url传递值 js加密解密 HTML中让表单input等文本框为只读不可编辑的方法 js监听用户的键盘敲击事件,兼容各大主流浏览器 HTML特殊字符
- Javascript将字符串日期格式化为yyyy-mm-dd的方法 js number 类型 没有length 属性 string类型才有
- 【JavaScript】JS最简单的二级折叠菜单的实现方法(完整实例)
- 【JS】js创建Object对象和构造函数的多种方法(综合示例)
- js new一个对象的过程,实现一个简单的new方法
- 使用 原生js 制作插件 (javaScript音乐播放器)
- 01Vue - Vue.js 入门(声明式渲染)
- JS实现关闭当前子窗口,刷新父窗口及调用父窗口的方法
- js - object的属性操作
- JS同名方法,
- 使用Underscore.js的template将Backbone.js的js代码和html代码分离
- (18)打鸡儿教你Vue.js
- 【HarmonyOS】【JS】【布局】鸿蒙js开发input 输入框弹出输入法时上方布局被挤扁?
- 【HarmonyOS】【JS】鸿蒙Js camera怎么拍照并使用image显示出来
- 读JS高级API笔记_(DOM&&DOM2&&DOM3)哎呀——园龄才9个月啊
- 《D3.js数据可视化实战手册》—— 第2章精挑细选
- JS 正则表达式常用方法
- 向vuex存储数据和获取数据-和直接调用actions.js中的异步方法
- JS的filter用法
- jquery.cookie.js 使用方法
- js中的闭包内存泄漏的两种解决方法
- js 给json添加新的字段,或者添加一组数据,在JS数组指定位置删除、插入、替换元素
- JS 工具函数 方法(其中js的crc32和php的crc32区别)
- [js高手之路]封装运动框架实战左右与上下滑动的焦点轮播图
- [js高手之路] 我的开源javascript框架gdom - 选择器用法
- js操作cookie
- Web 前端 之 Vue 浏览器调试工具 Vue.js devtools 安装(三种方法)的简单整理
- js阻止事件冒泡的两种方法