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. 演示Thread.sleep(100)和Thread.currentThread().isInterrupted()+@Deprecated:将方法标注为废弃的方法

    package charpter08; public class TestInterrupt01 { public static void main(String[] args) { Processo ...

  2. 用函数打印Hello js

    <script> function sayHello() { document.write("Hello js!"); } sayHello(); </scrip ...

  3. IntelliJ IDEA快捷键:Ctrl+Alt+B

    To navigate to the implementation(s) of an abstract method,position the caret at its usage or its na ...

  4. 【Java】 剑指offer(39) 数组中出现次数超过一半的数字

    本文参考自<剑指offer>一书,代码采用Java语言. 更多:<剑指Offer>Java实现合集   题目 数组中有一个数字出现的次数超过数组长度的一半,请找出这个数字.例如 ...

  5. 【Java】 剑指offer(47) 礼物的最大价值

    本文参考自<剑指offer>一书,代码采用Java语言. 更多:<剑指Offer>Java实现合集   题目 在一个m×n的棋盘的每一格都放有一个礼物,每个礼物都有一定的价值( ...

  6. DSP 知识点

    1:自定义数据段 #pragma DATA_SECTION(symbol,".section") Int32 symbol[LENGTH]; 2:前几天遇到一个问题.dsp在执行某 ...

  7. 洛谷 p1434 滑雪【记忆化搜索】

    <题目链接> Michael喜欢滑雪.这并不奇怪,因为滑雪的确很刺激.可是为了获得速度,滑的区域必须向下倾斜,而且当你滑到坡底,你不得不再次走上坡或者等待升降机来载你.Michael想知道 ...

  8. Spring 注解@Transactional readOnly=true

    引子 今天下班后,以前同事小胖问我Spring  Service类中的注解@Transactional readOnly=true的作用.做为他眼中的高人,我自然要装下A-C.居然想都没有想就说是注解 ...

  9. IdentityServer4-端点

    一.发现端点 二.授权端点 三.令牌端点 四.UserInfo端点 五.Introspection端点 六.撤销端点 七.结束会话端点 一.发现端点 发现端点可用于检索有关IdentityServer ...

  10. flask第十篇——url_for【3】

      继续url_for的知识点 # coding: utf-8 from flask import Flask, url_forimport flask app = Flask(__name__)   ...