js中apply方法的使用详细解析_javascript技巧

1、对象的继承,一般的做法是复制:Object.extend
prototype.js的实现方式是:

复制代码 代码如下:

Object.extend = function(destination, source) {
    for (property in source) {
        destination[property] = source[property];
    }
    return destination;
}

除此之外,还有种方法,就是:Function.apply(当然使用Function.call也是可以的)

apply方法能劫持另外一个对象的方法,继承另外一个对象的属性

Function.apply(obj,args)方法能接收两个参数

obj:这个对象将代替Function类里this对象

args:这个是数组,它将作为参数传给Function(args-->arguments)

apply示范代码如下:

复制代码 代码如下:

<script>
function Person(name,age){   //定义一个类,人类 
    this.name=name;     //名字 
    this.age=age;       //年龄
    this.sayhello=function(){alert("hello")};
}
function Print(){            //显示类的属性
    this.funcName="Print";
    this.show=function(){     
        var msg=[];
        for(var key in this){
            if(typeof(this[key])!="function"){
                msg.push([key,":",this[key]].join(""));
            }
        }
        alert(msg.join(" "));
    };
}
function Student(name,age,grade,school){    //学生类
    Person.apply(this,arguments);
    Print.apply(this,arguments);
    this.grade=grade;                //年级
    this.school=school;                 //学校
}
var p1=new Person("jake",10);
p1.sayhello();
var s1=new Student("tom",13,6,"清华小学");
s1.show();
s1.sayhello();
alert(s1.funcName);
</script>

学生类本来不具备任何方法,但是在Person.apply(this,arguments)后,

他就具备了Person类的sayhello方法和所有属性。

在Print.apply(this,arguments)后就自动得到了show()方法

2、利用Apply的参数数组化来提高

Function.apply()在提升程序性能方面的技巧

我们先从Math.max()函数说起,Math.max后面可以接任意个参数,最后返回所有参数中的最大值。

比如
alert(Math.max(5,8))   //8
alert(Math.max(5,7,9,3,1,6))   //9

但是在很多情况下,我们需要找出数组中最大的元素。

复制代码 代码如下:

var arr=[5,7,9,1]
alert(Math.max(arr))    // 这样却是不行的。一定要这样写

function getMax(arr){
    var arrLen=arr.length;
    for(var i=0,ret=arr[0];i<arrLen;i++){
        ret=Math.max(ret,arr[i]);      
    }
    return ret;
}

这样写麻烦而且低效。如果用 apply呢,看代码:

复制代码 代码如下:

function getMax2(arr){
    return Math.max.apply(null,arr);
}

两段代码达到了同样的目的,但是getMax2却优雅,高效,简洁得多。

再比如数组的push方法。
var arr1=[1,3,4];
var arr2=[3,4,5];

如果我们要把 arr2展开,然后一个一个追加到arr1中去,最后让arr1=[1,3,4,3,4,5]
arr1.push(arr2)显然是不行的。 因为这样做会得到[1,3,4,[3,4,5]]

我们只能用一个循环去一个一个的push(当然也可以用arr1.concat(arr2),但是concat方法并不改变arr1本身)

复制代码 代码如下:

var arrLen=arr2.length
for(var i=0;i<arrLen;i++){
    arr1.push(arr2[i]);
}

自从有了Apply,事情就变得如此简单
Array.prototype.push.apply(arr1,arr2)

时间: 2024-10-29 23:08:47

js中apply方法的使用详细解析_javascript技巧的相关文章

Javascript中各种trim的实现详细解析_javascript技巧

这是lgzx公司的一道面试题,要求给js的String添加一个方法,去除字符串两旁的空白字符(包括空格.制表符.换页符等). 复制代码 代码如下: String.prototype.trim = function() {     //return this.replace(/[(^\s+)(\s+$)]/g,"");//會把字符串中間的空白符也去掉     //return this.replace(/^\s+|\s+$/g,""); //     return t

js的正则test,match,exec详细解析_javascript技巧

正则表达式gi我刚开始也看不懂,从网上找到后看到了,现在分享给大家正在表达式的通项: /pattern/flags 即(/模式/标记 ) 构造器函数方法使用方法如下:new RegExp("pattern"[, "flags"])即new RegExp("模式"[,"标记"])参数:pattern(模式)表示正则表达式的文本flags(标记)如果指定此项,flags可以是下面值之一:g: global match(全定匹配)i

关于JS中的apply,call,bind的深入解析_javascript技巧

在Javascript中,Function是一种对象.Function对象中的this指向决定于函数被调用的方式.使用apply,call 与 bind 均可以改变函数对象中this的指向,在说区别之前还是先总结一下三者的相似之处: 1.都是用来改变函数的this对象的指向的. 2.第一个参数都是this要指向的对象. 3.都可以利用后续参数传参. call方法: 语法:call([thisObj[,arg1[, arg2[,   [,.argN]]]]]) 定义:调用一个对象的一个方法,以另一

js中opener与parent的区别详细解析_javascript技巧

opener即谁打开我的,比如A页面利用window.open弹出了B页面窗口,那么A页面所在窗口就是B页面的opener,在B页面通过opener对象可以访问A页面. parent表示父窗口,比如一个A页面利用iframe或frame调用B页面,那么A页面所在窗口就是B页面的parent.在JS中,window.opener只是对弹出窗口的母窗口的一个引用.比如:a.html中,通过点击按钮等方式window.open出一个新的窗口b.html.那么在b.html中,就可以通过window.o

js判断undefined类型,undefined,null, 的区别详细解析_javascript技巧

js判断undefined类型 今天使用showModalDialog打开页面,返回值时.当打开的页面点击关闭按钮或直接点浏览器上的关闭则返回值是undefined所以自作聪明判断   var reValue=window.showModalDialog("","","");   if (reValue== undefined){  alert("undefined"); } 发现判断不出来,最后查了下资料要用typeof 方

js老生常谈之this,constructor ,prototype全面解析_javascript技巧

前言 javascript中的this,constructor ,prototype,都是老生常谈的问题,深入理解他们的含义至关重要.在这里,我们再来复习一下吧,温故而知新! this this表示当前对象,如果在全局作用范围内使用this,则指代当前页面对象window: 如果在函数中使用this,则this指代什么是根据运行时此函数在什么对象上被调用. 我们还可以使用apply和call两个全局方法来改变函数中this的具体指向. 先看一个在全局作用范围内使用this的例子: console

JavaScript中原型链存在的问题解析_javascript技巧

我们知道使用原型链实现继承是一个goodway:)看个原型链继承的例子. function A () { this.abc = 44; } A.prototype.getAbc = function (){ return this.abc; }; function B() { } B.prototype = new A(); // B通过A的实例完成了继承,形成了原型链(B的原型就是A的实例) var b = new B(); b.getAbc(); 关系如下:b(实例) ->B.prototy

浅析Javascript中bind()方法的使用与实现_javascript技巧

我们先来看一道题目 var write = document.write; write("hello"); //1.以上代码有什么问题 //2.正确操作是怎样的 不能正确执行,因为write函数丢掉了上下文,此时this的指向global或window对象,导致执行时提示非法调用异常,所以我们需要改变this的指向 正确的方案就是使用 bind/call/apply来改变this指向 bind方法 var write = document.write; write.bind(docum

js中利用cookie实现记住密码功能_javascript技巧

在登录界面添加记住密码功能,我首先想到的是在java后台中调用cookie存放账号密码,大致如下: HttpServletRequest request HttpServletResponse response Cookie username = new Cookie("username ","cookievalue"); Cookie password = new Cookie("password ","cookievalue&quo