手写 call apply bind

news/2024/7/10 23:05:08 标签: 前端, javascript, es6
javascript">// 定义一个 show 方法
        function show(...args) {
            console.log(this);
        }
        // 原型上新增一个 myCall 方法
        Function.prototype.myCall = function (ctx, ...args) {
            // console.log(this);//此时 this 指向 show 方法
            ctx.fn = this//把 show 方法赋值给 ctx 上的一个属性 fn 方法
            ctx.fn(...args)//调用 fn 方法,对象上方法,谁调用 this 指向谁,所以此时 this 指向 ctx,就是传入进来的新对象 {name:'zs'}
            delete ctx.fn//删除该属性
        }
        // 调用 myCall 方法并传入一个新的对象
        //  call 方法传参方式:
        //                  参数1:对象
        //                  参数2,参数3.......:多个属性一一传值
        show.myCall({ name: 'zs' }, '参数1', '参数2', '参数3')



        // 原型上新增一个 myApply 方法
        Function.prototype.myApply = function (ctx, args) {
            if (args && !(args instanceof Array)) throw ('myApply方法只接受数组作为参数')
            ctx.fn = this
            ctx.fn(args)
            delete ctx.fn
        }
            //  apply 方法传参方式:
            //               参数1:对象
            //               参数2:数组(多个属性作为数组的成员项)
        show.myApply({ name: 'zs' }, ['参数1', '参数2', '参数3'])



        // 原型上新增一个 bind 方法
        Function.prototype.myBind = function (ctx, ...args1) { 
            // bind 返回一个新的函数,需要再次调用
            return (...args2)=>{
                ctx.fn=this
                ctx.fn(...args1.concat(args2))
                delete ctx.fn
            }
        }
            //  bind 方法传参方式:
            //               参数1:对象
            //               参数2,参数3.......:多个属性一一传值
            //
        const bind=show.myBind({ name: 'zs' }, '参数1', '参数2', '参数3')
        // bind 返回一个新的函数,需要再次调用
        bind('参数4')


http://www.niftyadmin.cn/n/1409361.html

相关文章

java面试题 级hr解答 非技术问题 !=!=未看

Java基础 ● 集合类以及集合框架;HashMap与HashTable实现原理,线程安全性,hash冲突及处理算法;ConcurrentHashMap; ● 进程和线程的区别; ● Java的并发、多线程、 线程模型; ● 什么是线程…

git gui fetch不到文件_Git内部原理剖析

正文共:13110字 ,预计阅读时间:33分钟1. 导读1.1. 为什么写这篇文章写这篇文章的本意有二:工作安排原因,常有同事询问我一些关于 Git 的问题,总觉得自己解释的不够透彻,因此觉得有必要深入了解一下。目前中文的 Git 教…

call apply bind 的使用方法

function Father(name) {this.name nameconsole.log(this);}const obj{age:12}Father.call(obj, zs)Father.apply(obj, [zs])Father.bind(obj, zs)()

set desktop for aliyun ubuntu

apt-get update apt-get upgradeapt-get install x-window-system-core apt-get install gnome-core apt-get install gdmstartxcommand: ctrl alt f1 graphical: ctrl alt f7转载于:https://www.cnblogs.com/otfsenter/p/9018384.html

有关NaN的那些事

NaN的意思是“不是数值 Not a Number”的意思,用来表示本来是要返回一个数值,但是操作失败了,(注意:并不是抛出错误) NaN有几个特殊的属性,首先任何涉及NaN的操作都会返回NaN 例如: console.log(NaN NaN) // 返回 false 为此ECMAScript提供了一个 isNaN的方法,该方法接收一个参…

eigrp配置实验_【实战演练】Packet Tracer玩转CCNA实验15-ACL访问控制列表

#本文欢迎转载,转载请注明出处和作者。ACL即(Access Control List,即访问控制列表),其实,就是可以控制IP源、目的IP地址,端口号,因此可以在路由可达的情况下,相当于设置例…

apache与nginx

Apache与Nginx的优缺点比较 1、nginx相对于apache的优点: 轻量级,同样起web 服务,比apache 占用更少的内存及资源 抗并发,nginx 处理请求是异步非阻塞的,而apache 则是阻塞型的,在高并发下nginx 能保持低资…

【IntellJ IDEA】idea上 实现了Serializable接口,要自动生成serialVersionUID的方法

需要点进setting ->搜索Inspections-->右侧选择java 下拉 进入Serialization issue--->勾选Serializable class without serialVersionUID 勾选上以后,应用 确定 确定的时候 不要勾选 然后在类上 altEntert 即可提示