call和apply的作用:

就是"借用"其他的函数,完成事情,第一个参数都是“借用”的主体。

1、模拟call实现

Function.prototype.myCall = function (context) {
var context = context || window
// 给 context 添加一个属性
// getValue.call(a, 'yck', '24') => a.fn = getValue
context.fn = this
// 将 context 后面的参数取出来
var args = [...arguments].slice(1)
// getValue.call(a, 'yck', '24') => a.fn('yck', '24')
var result = context.fn(...args)
// 删除 fn
delete context.fn
return result
}

2、模拟apply实现

Function.prototype.myApply = function (context) {
var context = context || window
context.fn = this var result
// 需要判断是否存储第二个参数
// 如果存在,就将第二个参数展开
if (arguments[1]) {
result = context.fn(...arguments[1])
} else {
result = context.fn()
} delete context.fn
return result
}

3、模拟bind实现

Function.prototype.myBind = function (context) {
if (typeof this !== 'function') {
throw new TypeError('Error')
}
var _this = this
var args = [...arguments].slice(1)
// 返回一个函数
return function F() {
// 因为返回了一个函数,我们可以 new F(),所以需要判断
if (this instanceof F) {
return new _this(...args, ...arguments)
}
return _this.apply(context, args.concat(...arguments))
}
}

js 模拟call、apply、bind实现的更多相关文章

  1. JS 的 call apply bind 方法

    js的call apply bind 方法都很常见,目的都是为了改变某个方法的执行环境(context) call call([thisObj[,arg1[, arg2[,   [,.argN]]]] ...

  2. js: this,call,apply,bind 总结

    对js中的一些基本的很重要的概念做一些总结,对进一步学习js很重. 一.this JavaScript 中的 this 总是指向一个对象,而具体指向那个对象是在运行时基于函数的执行环境动态绑定的,而非 ...

  3. JS中call,apply,bind方法的总结

    why?call,apply,bind干什么的?为什么要学这个? 一般用来指定this的环境,在没有学之前,通常会有这些问题. var a = { user: "小马扎", fn: ...

  4. 学习前端的菜鸡对JS的call,apply,bind的通俗易懂理解

       call,apply,bind 在JavaScript中,call.apply和bind是Function对象自带的三个方法,都是为了改变函数体内部 this 的指向.            a ...

  5. js 中call,apply,bind的区别

    call.apply.bind方法的共同点与区别: apply.call.bind 三者都是用来改变函数的this对象的指向: apply.call.bind 三者都可以利用后续参数传参: bind ...

  6. 原生JS实现call,apply,bind函数

    1. 前言 使用原生JS实现call和apply函数,充分了解其内部原理.call和apply都是为了解决改变this的指向.作用都相同,只是传参的方式不同.除了第一个参数外,call可以接受一个参数 ...

  7. js笔记——call,apply,bind使用笔记

    call和apply obj.call(thisObj, arg1, arg2, ...); obj.apply(thisObj, [arg1, arg2, ...]); 两者作用一致,都是把obj( ...

  8. JS之call/apply/bind

    测试代码: var a = 1; var obj = { a = 2; } function test(a){ alert(a); alert(this.a); } 1.test(3); 结果:3,1 ...

  9. js 对call apply bind理解

    请参考 http://www.cnblogs.com/xljzlw/p/3775162.html 1.call和apply的区别:参数类型不同var mtt = { name: "mtt&q ...

  10. js new call apply bind 的 原理

    new new 做了什么事?1. 以 Object.protoype 为原型创建一个新对象 2. 以新对象为 this,执行函数的 [[call]] 3. 如果 [[call]] 的返回值是对象,那么 ...

随机推荐

  1. 步步为营-68-asp.net简单练习(get set)

    1 加法计算器 using System; using System.Collections.Generic; using System.Linq; using System.Text; using ...

  2. Oracle学习笔记--第3章 使用sql*plus工具

    使用sql*plus工具 1.sqlplus连接方式示例 sqlplus system/123[as sysdba]; 2.查看表结构命令;desc[ribe] e.g.      desc scot ...

  3. ubuntu装软件包

    查找包 aptitude search pkgName pkgName可以有多个(空格分隔) ffmpeg sudo add-apt-repository ppa:kirillshkrogalev/f ...

  4. 【目录】LeetCode Java实现

    这里记录一下自己刷的LeetCode题目. 有些博客用英文阐述自己的思路和收获,相当于练习一下英文的表达能力. 比较好的题目有加粗. 1. Two Sum 3. Longest Substring W ...

  5. 013 Spark中的资源调优

    1.平常的资源使用情况 2.官网 3.资源参数调优 cores memory JVM 4.具体参数 可以在--conf参数中给定资源配置相关信息(配置的一般是JVM的一些垃圾回收机制) --drive ...

  6. EXIST子查询

    已知关系模式:S(Sno,Sname,Sclass),C(Cno,Cname,Cteacher),SC(Sno,Cno,Scgrade).其中,S为学生关系:Sno学号, Sname姓名,Sclass ...

  7. drupal8

    创建drupal的博客教程地址 区域:主题中必须定义 content 区域:因为内容(文章列表)就在content区域 定义成区块的时候可以将试图的区块放在内容区域里面: 视图通过区块和页面来显示在页 ...

  8. xpath-helper: 谷歌浏览器安装xpath helper 插件

    1.下载文件xpath-helper.crx xpath链接:https://pan.baidu.com/s/1dFgzBSd 密码:zwvb,感谢这位网友,我从这拿到了 2.在Google浏览器里边 ...

  9. mac 回车键、空格键失灵(非物理原因)解决方法

    1.关机2.按住shift+control+option+开关机键,大概10秒左右,观察键盘电源灯是否变色,确定是否硬件故障,不变色表正常.3.先按下开关机键后,放开.然后同时按住option+com ...

  10. CPU个数、CPU核心数、CPU线程数

    CPU个数.CPU核心数.CPU线程数 我们在选购电脑的时候,CPU是一个需要考虑到核心因素,因为它决定了电脑的性能等级.CPU从早期的单核,发展到现在的双核,多核.CPU除了核心数之外,还有线程数之 ...