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


Posted in Javascript onNovember 04, 2013

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)
Javascript 相关文章推荐
jQuery对象[0]是什么含义?
Jul 31 Javascript
javascript预览上传图片发现的问题的解决方法
Nov 25 Javascript
兼容主流浏览器的JS复制内容到剪贴板
Dec 12 Javascript
jquery实现浮动在网页右下角的彩票开奖公告窗口代码
Sep 04 Javascript
jQuery实现表格冻结顶栏效果
Aug 20 jQuery
vue父组件中获取子组件中的数据(实例讲解)
Sep 27 Javascript
js构造函数创建对象是否加new问题
Jan 22 Javascript
解决Jquery下拉框数据动态获取的问题
Jan 25 jQuery
node结合swig渲染摸板的方法
Apr 11 Javascript
详解Require.js与Sea.js的区别
Aug 05 Javascript
详解在vue-cli项目下简单使用mockjs模拟数据
Oct 19 Javascript
vue父子组件的通信方法(实例详解)
Nov 10 Javascript
js数组操作学习总结
Nov 04 #Javascript
Javascript执行效率全面总结
Nov 04 #Javascript
jquery的map与get方法详解
Nov 04 #Javascript
ajax请求get与post的区别总结
Nov 04 #Javascript
jquery text(),val(),html()方法区别总结
Nov 04 #Javascript
jquery获取一组checkbox的值(实例代码)
Nov 04 #Javascript
阻止事件(取消浏览器对事件的默认行为并阻止其传播)
Nov 03 #Javascript
You might like
Zend Framework教程之Zend_Form组件实现表单提交并显示错误提示的方法
2016/03/21 PHP
PHP实现对文件锁进行加锁、解锁操作的方法
2017/07/04 PHP
laravel5.4生成验证码的实例讲解
2017/08/05 PHP
PHP单元测试框架PHPUnit用法详解
2019/01/23 PHP
jQuery的初始化与对象构建之浅析
2011/04/12 Javascript
关于JAVASCRIPT urldecode URL解码的问题
2012/01/08 Javascript
jquery如何实现在加载完iframe的内容后再进行操作
2013/09/10 Javascript
JavaScript的继承的封装介绍
2013/10/15 Javascript
jsp 网站引入外部css或者js失效问题解决
2016/10/31 Javascript
详解nodejs 文本操作模块-fs模块(五)
2016/12/23 NodeJs
自定义vue全局组件use使用、vuex的使用详解
2017/06/14 Javascript
js实现Tab选项卡切换效果
2020/07/17 Javascript
vue jsx 使用指南及vue.js 使用jsx语法的方法
2017/11/11 Javascript
layerui代码控制tab选项卡,添加,关闭的实例
2019/09/04 Javascript
使用原生JS实现火锅点餐小程序(面向对象思想)
2019/12/10 Javascript
Quasar Input:type=&quot;number&quot; 去掉上下小箭头 实现加减按钮样式功能
2020/04/09 Javascript
使用JavaScript实现网页秒表功能(含开始、暂停、继续、重置功能)
2020/06/05 Javascript
详解Vue的组件中data选项为什么必须是函数
2020/08/17 Javascript
vue-quill-editor插入图片路径太长问题解决方法
2021/01/08 Vue.js
Python设计模式之桥接模式原理与用法实例分析
2019/01/10 Python
python实现学员管理系统
2019/02/26 Python
Python实现的插入排序,冒泡排序,快速排序,选择排序算法示例
2019/05/04 Python
浅谈python中频繁的print到底能浪费多长时间
2020/02/21 Python
3种适用于Python的疯狂秘密武器及原因解析
2020/04/29 Python
python轮询机制控制led实例
2020/05/03 Python
在keras里实现自定义上采样层
2020/06/28 Python
CSS3中的@keyframes关键帧动画的选择器绑定
2016/06/13 HTML / CSS
5分钟让你掌握css3阴影、倒影、渐变小技巧(小编推荐)
2016/08/15 HTML / CSS
css3实现画半圆弧线的示例代码
2017/11/06 HTML / CSS
canvas裁剪clip()函数的具体使用
2018/03/01 HTML / CSS
迪卡侬荷兰官网:Decathlon荷兰
2017/10/29 全球购物
校园之星获奖感言
2014/01/29 职场文书
2015年社区科普工作总结
2015/05/13 职场文书
2016年国庆节新闻稿范文
2015/11/25 职场文书
《金肉人》米特&《航海王》阿鹤声优松岛实因胰脏癌去世 享寿81岁
2022/04/13 日漫
一文了解Java动态代理的原理及实现
2022/07/07 Java/Android