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 相关文章推荐
document.getElementById的简写方式(获取id对象的简略写法)
Sep 10 Javascript
jquery中dom操作和事件的实例学习-表单验证
Nov 30 Javascript
点击进行复制的JS代码实例
Aug 23 Javascript
12306验证码破解思路分享
Mar 25 Javascript
jQuery实现仿腾讯微博滑出效果报告每日天气的方法
May 11 Javascript
详解JavaScript中基于原型prototype的继承特性
May 05 Javascript
JS图片等比例缩放方法完整示例
Aug 03 Javascript
搭建Bootstrap离线文档的方法
Dec 02 Javascript
React应用中使用Bootstrap的方法
Aug 15 Javascript
iview实现select tree树形下拉框的示例代码
Dec 21 Javascript
vue+elementUI中表格高亮或字体颜色改变操作
Nov 02 Javascript
聊聊vue 中的v-on参数问题
Jan 29 Vue.js
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
php中final关键字用法分析
2016/12/07 PHP
php 静态属性和静态方法区别详解
2017/04/09 PHP
php实现自定义中奖项数和概率的抽奖函数示例
2017/05/26 PHP
YII2框架中ActiveDataProvider与GridView的配合使用操作示例
2020/03/18 PHP
HTML IMG标签 onload 内存溢出导致浏览器CPU占用过高
2021/03/09 Javascript
js限制文本框只能输入数字方法小结
2014/06/16 Javascript
javascript制作坦克大战全纪录(2)
2014/11/27 Javascript
javascript实现图片跟随鼠标移动效果的方法
2015/05/13 Javascript
jQuery移动页面开发中的触摸事件与虚拟鼠标事件简介
2015/12/03 Javascript
JavaScript观察者模式(经典)
2015/12/09 Javascript
深入分析Javascript事件代理
2016/01/30 Javascript
javascript Promise简单学习使用方法小结
2016/05/17 Javascript
jQuery中ztree 点击文本框弹出下拉框的实例代码
2017/02/05 Javascript
setTimeout函数的神奇使用
2017/02/26 Javascript
详解NodeJs项目 CentOs linux服务器线上部署
2019/09/16 NodeJs
vue中解决拖拽改变存在iframe的div大小时卡顿问题
2020/07/22 Javascript
Vue实现手机计算器
2020/08/17 Javascript
python实现自动更换ip的方法
2015/05/05 Python
Flask框架实现给视图函数增加装饰器操作示例
2018/07/16 Python
Python3日期与时间戳转换的几种方法详解
2019/06/04 Python
python从zip中删除指定后缀文件(推荐)
2019/12/05 Python
TensorFlow绘制loss/accuracy曲线的实例
2020/01/21 Python
解决TensorFlow训练模型及保存数量限制的问题
2021/03/03 Python
欧洲领先的电子和电信零售商和服务提供商:Currys PC World Business
2017/12/05 全球购物
西班牙多品牌鞋店连锁店:Krack
2018/11/30 全球购物
DBA的职责都有哪些
2012/05/16 面试题
模具专业毕业推荐信
2014/03/08 职场文书
企业文化标语口号
2014/06/09 职场文书
旅行社优秀创业计划书
2014/08/16 职场文书
教代会开幕词
2015/01/28 职场文书
公司承诺书格式范文
2015/04/28 职场文书
python爬取网页版QQ空间,生成各类图表
2021/06/02 Python
python基础入门之字典和集合
2021/06/13 Python
Python加密与解密模块hashlib与hmac
2022/06/05 Python
V Rising 服务器搭建图文教程
2022/06/16 Servers
create-react-app开发常用配置教程
2022/06/25 Javascript