《javascript设计模式与开放实践》学习(一)Function.prototype.bind

使用Function.prototype.bind来包装func函数

1、简化版的bind

Function.prototype.bind=function (context) {
        var self=this; //保存原函数
        return function () {
            return self.apply(context,arguments);
        }
    };
    var obj={name:‘seven‘};
    var func=function(){
        alert(this.name);
    }.bind(obj);

    func();

2、含参数的bind

Function.prototype.bind=function()  {
        var self=this;
        context=[].shift.call(arguments);//需要绑定的this上下文
        args=[].slice.call(arguments);//剩余的参数
        return function () {
            return self.apply(context,[].concat.call(args,[].slice.call(arguments)));       //等同于return self.apply(context,args.concat(arguments));此arguments后传入的参数
}; } var obj={name:‘seven‘}; var func=function(a,b,c,d){ alert(this.name);//输出seven alert([a,b,c,d]);//输出[1,2,3,4] }.bind(obj,1,2) func(3,4);

注:

1)arguments对象: arguments 对象并不是一个数组,访问单个参数的方式与访问数组元素的方式相同。

2)shift用法:用于把数组的第一个元素从其中删除,并返回第一个元素的值。

2)slice用法:slice() 方法可从已有的数组中返回选定的元素。

3)concat用法:concat() 方法用于连接两个或多个数组。

时间: 2024-12-25 16:57:58

《javascript设计模式与开放实践》学习(一)Function.prototype.bind的相关文章

《javascript设计模式与开放实践》学习(三)高阶函数的应用

一.AOP(面向切面编程) Function.prototype.before=function (beforefn) { var _self=this;//保持原函数的引用 return function () {//返回包含原函数和新函数的“代理”函数 beforefn.apply(this,arguments);//执行新函数,修正this return _self.apply(this,arguments);//执行原函数 } } Function.prototype.after=fun

《javascript设计模式与开放实践》学习(五)惰性单例模式

在JS中可以使用代理来实现单例模式.如创建唯一DIV的场景: var CreateDiv=function (html) { this.html=html; this.init(); } CreateDiv.prototype.init=function () { var div=document.createElement('div'); div.innerHTML=this.html; document.body.appendChild(div); } var ProxySingleCrea

《javascript设计模式与开放实践》学习(二)对象方法的借用

1.借用构造函数 var A=function (name) { this.name=name; } var B=function () { A.apply(this,arguments);//借用A的函数构造器 } B.prototype.getName=function () { return this.name; }; var b=new B('Seven'); console.log(b.getName());//输出Seven 2.arguments增删元素 arguments虽然有“

《javascript设计模式与开放实践》学习(三)函数的闭包1

假设也没有上有5个div节点,通过循环给每个div绑定onclick实现弹出对应的编号.代码如下: <div>1</div> <div>2</div> <div>3</div> <div>4</div> <div>5</div> <script> var nodes=document.getElementsByTagName('div'); for (var i=0,len=

《javascript设计模式与开放实践》学习(四)私有变量

为了避免全局变量被污染,可采用加命名空间和闭包封装方式进行私有化. 一.使用命名空间 将某个变量变成某个命名空间下私有变量 var MyApp={}; MyApp.namespace=function (name) { var parts=name.split('.'); var current=MyApp; for(var i in parts){ if(!current[parts[i]]){ current[parts[i]]={}; } current=current[parts[i]]

《javascript设计模式与开放实践》学习(一)javascript实现多态

还是以鸭子唱歌为例 1.prototype 给对象添加方法或属性 <script> var makeSound=function (animal) { animal.sound(); } var Duck=function () { } Duck.prototype.sound=function () { console.log("嘎嘎嘎"); } var Chichen=function () { } Chichen.prototype.sound=function ()

JavaScript设计模式与开发实践——JavaScript的多态

"多态"一词源于希腊文polymorphism,拆开来看是poly(复数)+ morph(形态)+ ism,从字面上我们可以理解为复数形态. 多态的实际含义是:同一操作作用于不同的对象上面,可以产生不同的解释和不同的执行结果.换句话说,给不同的对象发送同一个消息的时候,这些对象会根据这个消息分别给出不同的反馈. 从字面上来理解多态不太容易,下面我们来举例说明一下. 主人家里养了两只动物,分别是一只鸭和一只鸡,当主人向它们发出"叫"的命令时,鸭会"嘎嘎嘎&q

JavaScript设计模式与开发实践【第一部分】

今天开始阅读<JavaScript设计模式与开发实践>,对于设计模式的学习一直渴望已久. 设计模式的定义是:在面向对象软件设计过程中针对特定问题的简洁而优雅的解决方案. 其实平时在工作中不知不觉在使用某些设计模式,只是我们不知道而已. 动态类型语言和静态类型语言 静态类型语言在编译时便已确定变量的类型,而动态类型语言的变量类型要到程序运行的时 候,待变量被赋予某个值之后,才会具有某种类型. 静态类型语言的优点首先是在编译时就能发现类型不匹配的错误,编辑器可以帮助我们提前 避免程序在运行期间有可

《JavaScript设计模式与开发实践》读书笔记之观察者模式

1.<JavaScript设计模式与开发实践>读书笔记之观察者模式 观察者模式定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知. JavaScript中通常采用事件模型替代传统的观察者模式 1.1 逐步实现观察者模式 以客户看房为例 首先指定谁充当发布者,如售楼处 然后给发布者添加一个缓存列表,用于存放回调函数以便通知订阅者.这里为了让订阅者只接收自己感兴趣的消息,增加一个标识key 最后发布消息时候,发布者遍历缓存列表,依次触发里面存放的订阅者的回