javascript中call apply 的应用场景


Posted in Javascript onApril 16, 2015

在一些jQuery插件中经常看到类似 callback.call(xxx,xxx) 虽然看到书上有介绍 说call和apply函数可以改变作用域,但还是无法非常透彻的理解改变作用域主要是为了解决什么问题,有没有替代方案,或者 这2个函数主要为了解决什么问题,应用场景,何时使用最合适,每次读到这样的代码就晕了,一下子从线性阅读中跳出去了,感觉有点绕

call和apply的作用很简单,就是改变上下文,适用场景太多了,虽然有时候只是为了“美观”,下面几个是我常用的。

1.

Object.prototype.toString.call(Obj)

用来判断 Obj 的类型

arguments 虽然和Array 很像,但是他没有Array的push之类的方法,怎么办?
Array.prototype.push.call(arguments)

3.Javascript 没有私有方法的概念,想用闭包实现

(function () {
  var Person = function () {
    this.doSomeThing = function () {
      _privateFunction.call(this);
    }
  }

  var _privateFunction = function () {

  }

  window.Person = Person;

}).call(window);

差不多就是这个意思,callback的时候,当你希望你的callback中的上下文是当前上下文的时候,也可以用call或者apply,有什么好处呢?

这个时候你的callback 里面的this 就是指代当前上下文。例如一个类Person,然后他的方法 say 有一个callback的参数,如果这个callback是通过普通的括号来执行的话,那在这个callback里面执行person的其它方法还需要用person.other 来实现,但是切换上下文之后,就是this.other搞定~代码对比如下:

var Person = function(){

};

Person.prototype.say = function(callback){
  callback();
};

Person.prototype.other = function(){

};

var vincent = new Person();

vincent.say(function(){
  vincent.other();
});

用了call的:

var Person = function(){

};

Person.prototype.say = function(callback){
  callback.call(this);
};

Person.prototype.other = function(){

};

var vincent = new Person();

vincent.say(function(){
  this.other();
});

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
HTML长文本截取含有HTML代码同样适用的两种方法
Jul 31 Javascript
js导出table数据到excel即导出为EXCEL文档的方法
Oct 10 Javascript
两种不同的方法实现js对checkbox进行全选和反选
May 13 Javascript
Javascript中arguments和arguments.callee的区别浅析
Apr 24 Javascript
javascript作用域问题实例分析
Jul 13 Javascript
jquery动态导航插件dynamicNav用法实例分析
Sep 06 Javascript
jquery实现全屏滚动
Dec 28 Javascript
Angular 根据 service 的状态更新 directive
Apr 03 Javascript
vue.js整合vux中的上拉加载下拉刷新实例教程
Jan 09 Javascript
Vue隐藏显示、只读实例代码
Jul 18 Javascript
JS实现的进制转换,浮点数相加,数字判断操作示例
Nov 09 Javascript
Vue中keep-alive组件的深入理解
Aug 23 Javascript
javascript三元运算符用法实例
Apr 16 #Javascript
jQuery on()方法使用技巧详解
Apr 16 #Javascript
JavaScript简单表格编辑功能实现方法
Apr 16 #Javascript
JavaScript转换二进制编码为ASCII码的方法
Apr 16 #Javascript
JavaScript实现彩虹文字效果的方法
Apr 16 #Javascript
JavaScript监听文本框回车事件并过滤文本框空格的方法
Apr 16 #Javascript
JQuery跳出each循环的方法
Apr 16 #Javascript
You might like
5.PHP的其他功能
2006/10/09 PHP
聊天室php&mysql(六)
2006/10/09 PHP
php getimagesize 上传图片的长度和宽度检测代码
2010/05/15 PHP
php 定义404页面的实现代码
2012/11/19 PHP
PHP版 汉字转码的实现详解
2013/06/09 PHP
php实现的ping端口函数实例
2014/11/12 PHP
win10 apache配置虚拟主机后localhost无法使用的解决方法
2018/01/27 PHP
深入理解 PHP7 中全新的 zval 容器和引用计数机制
2018/10/15 PHP
PHP正则表达式处理函数(PCRE 函数)实例小结
2019/05/09 PHP
js 表格隔行颜色
2009/12/02 Javascript
JQuery中html()方法使用不当带来的陷阱
2011/04/07 Javascript
Linux下使用jq友好的打印JSON技巧分享
2014/11/18 Javascript
深入探讨javascript中的数据类型
2015/03/04 Javascript
javascript类型系统——undefined和null全面了解
2016/07/13 Javascript
JQuery动态添加Select的Option元素实现方法
2016/08/29 Javascript
微信小程序 location API接口详解及实例代码
2016/10/12 Javascript
Javascript获取background属性中url的值
2016/10/17 Javascript
JS前端开发判断是否是手机端并跳转操作(小结)
2017/02/05 Javascript
vue-router:嵌套路由的使用方法
2017/02/21 Javascript
jQueryeasyui 中如何使用datetimebox 取两个日期间相隔的天数
2017/06/13 jQuery
最全正则表达式总结:验证QQ号、手机号、Email、中文、邮编、身份证、IP地址等
2017/08/16 Javascript
Vue.js 中的 v-model 指令及绑定表单元素的方法
2018/12/03 Javascript
JavaScript动态添加数据到表单并提交的几种方式
2019/06/26 Javascript
vue-cli随机生成port源码的方法
2019/09/02 Javascript
JavaScript字符串处理常见操作方法小结
2019/11/15 Javascript
JavaScript实现简单随机点名器
2019/11/21 Javascript
[48:53]2014 DOTA2华西杯精英邀请赛 5 25 LGD VS VG第一场
2014/05/26 DOTA
[01:27:30]LGD vs Newbee 2019国际邀请赛小组赛 BO2 第二场 8.16
2019/08/19 DOTA
利用python的socket发送http(s)请求方法示例
2018/05/07 Python
使用Python批量修改文件名的代码实例
2019/01/24 Python
python plt可视化——打印特殊符号和制作图例代码
2020/04/17 Python
利用OpenCV中对图像数据进行64F和8U转换的方式
2020/06/03 Python
HTML5在手机端实现视频全屏展示方法
2020/11/23 HTML / CSS
女儿十岁生日答谢词
2014/01/27 职场文书
会务接待方案
2014/02/27 职场文书
客户经理竞聘演讲稿
2014/05/15 职场文书