未加星标

JS 中的 call、apply、bind 方法

字体大小 | |
[前端(javascript) 所属分类 前端(javascript) | 发布者 店小二05 | 时间 2017 | 作者 红领巾 ] 0人收藏点击收藏
call方法 语法 fun.call(thisArg[, arg1[, arg2[, ...]]]) thisArg : fun 函数运行时指定的 this 值,可能的值为: 不传,或者传 null , undefined , this 指向 window 对象 传递另一个函数的函数名 fun2 , this 指向函数fun2的引用
值为原始值(数字,字符串,布尔值),this会指向该原始值的自动包装对象,如 String、Number、Boolean 传递一个对象,函数中的 this 指向这个对象 apply方法 语法: apply([thisObj[,argArray]]) 定义:应用某一对象的一个方法,用另一个对象替换当前对象。 说明: apply 的第一个参数 thisObj 和 call 方法的一样,第二个参数 argArray 为一个传参数组 thisObj 如果未传,那么 Global 对象被用作 thisObj bind方法

在 ECMAScript5 中扩展了叫 bind 的方法( IE6,7,8 不支持)

语法: bind([thisObj[,arg1[, arg2[, [,.argN]]]]])

定义:应用某一对象的一个方法,用另一个对象替换当前对象。

说明: bind 的 thisObj 参数也和 call 方法一样, thisObj 如果未传,那么 Global 对象被用作 thisObj 。arg1 … argN可传可不传。如果不传,可以在调用的时候再传。如果传了,调用的时候则可以不传,调用的时候如果你还是传了,则不生效

var person = { name:"tsrot", age:24, sayHello:function(age){ console.log(this.name); console.log(age); } }; var son = { name:"xieliqun" }; var boundFunc = person.sayHello.bind(son); boundFunc(25); var boundFunc = person.sayHello.bind(son,25); boundFunc(); var boundFunc = person.sayHello.bind(son,25); boundFunc(30); 二、call、apply、bind的区别 call 的 arg 传参需一个一个传, apply 则直接传一个数组 function hello(name,age){ console.log(name); console.log(age); } hello.call(this,"tsrot",24); hello.apply(this,["tsrot",24]); call 和 apply 直接执行函数,而 bind 需要再一次调用 var obj = { x: 81, }; var foo = { getX: function() { return this.x; } } console.log(foo.getX.bind(obj)()); console.log(foo.getX.call(obj)); console.log(foo.getX.apply(obj)); 三、运用场景 实现继承 function Animal(name) { this.name = name; this.showName = function () { console.log(this.name); } } function Cat(name) { Animal.call(this, name); } var cat = new Cat('Black Cat'); cat.showName(); 数组追加 var array1 = [1 , 2 , 3, 5]; var array2 = ["xie" , "li" , "qun" , "tsrot"]; Array.prototype.push.apply(array1, array2); console.log(array1); 获取数组中的最大值和最小值 var num = [1,3,5,7,2,-10,11]; var maxNum = Math.max.apply(Math, num); var minNum = Math.min.apply(Math, num); console.log(maxNum); console.log(minNum); 将伪数组转化为数组 var fakeArr = {0:'a',1:'b',length:2}; var arr1 = Array.prototype.slice.call(fakeArr); console.log(arr1[0]); var arr2 = [].slice.call(fakeArr); console.log(arr2[0]); arr1.push("c"); console.log(arr1); 保存this变量

var foo = { bar : 1, eventBind: function(){ var _this = this ; $('.someClass').on('click',function(event) { console.log(_this.bar); }); } } var foo = { bar : 1, eventBind: function(){ $('.someClass').on('click',function(event) { console.log(this.bar); }.bind(this)); } }

本文前端(javascript)相关术语:javascript是什么意思 javascript下载 javascript权威指南 javascript基础教程 javascript 正则表达式 javascript设计模式 javascript高级程序设计 精通javascript javascript教程

主题: ECMAScript包装变量
分页:12
转载请注明
本文标题:JS 中的 call、apply、bind 方法
本站链接:http://www.codesec.net/view/520554.html
分享请点击:


1.凡CodeSecTeam转载的文章,均出自其它媒体或其他官网介绍,目的在于传递更多的信息,并不代表本站赞同其观点和其真实性负责;
2.转载的文章仅代表原创作者观点,与本站无关。其原创性以及文中陈述文字和内容未经本站证实,本站对该文以及其中全部或者部分内容、文字的真实性、完整性、及时性,不作出任何保证或承若;
3.如本站转载稿涉及版权等问题,请作者及时联系本站,我们会及时处理。
登录后可拥有收藏文章、关注作者等权限...
技术大类 技术大类 | 前端(javascript) | 评论(0) | 阅读(35)