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与css打造个性化的单选框和复选框
Oct 20 Javascript
当鼠标移动到图片上时跟随鼠标显示放大的图片效果
Jun 06 Javascript
js+html5获取用户地理位置信息并在Google地图上显示的方法
Jun 05 Javascript
Node.js实现JS文件合并小工具
Feb 02 Javascript
论Bootstrap3和Foundation5网格系统的异同
May 16 Javascript
基于JavaScript实现鼠标箭头移动图片跟着移动
Aug 30 Javascript
基于vue2.0实现的级联选择器
Jun 09 Javascript
vue-cli 组件的导入与使用教程详解
Apr 11 Javascript
element上传组件循环引用及简单时间倒计时的实现
Oct 01 Javascript
JQuery特殊效果和链式调用操作示例
May 13 jQuery
原生javascript的ajax请求及后台PHP响应操作示例
Feb 24 Javascript
解决vue使用vant轮播组件swipe + flex时文字抖动问题
Jan 07 Vue.js
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
php生成图形验证码几种方法小结
2013/08/15 PHP
sae使用smarty模板的方法
2013/12/17 PHP
Php无限级栏目分类读取的实现代码
2014/02/19 PHP
PHP与JavaScript针对Cookie的读写、交互操作方法详解
2017/08/07 PHP
Laravel如何创建服务器提供者实例代码
2019/04/15 PHP
imagettftext() 失效,不起作用
2021/03/09 PHP
jsTree树控件(基于jQuery, 超强悍)[推荐]
2009/09/01 Javascript
JavaScript CSS 修改学习第四章 透明度设置
2010/02/19 Javascript
jQuery解决下拉框select设宽度时IE 6/7/8下option超出显示不全
2013/05/27 Javascript
快速掌握Node.js环境的安装与运行方法
2016/02/16 Javascript
jQuery插件datatables使用教程
2016/04/21 Javascript
Vue.js:使用Vue-Router 2实现路由功能介绍
2017/02/22 Javascript
详解angularjs中如何实现控制器和指令之间交互
2017/05/31 Javascript
JavaScript输入分钟、秒倒计时技巧总结(附代码)
2017/08/17 Javascript
bootstrap Table服务端处理分页(后台是.net)
2017/10/19 Javascript
webpack打包并将文件加载到指定的位置方法
2018/02/22 Javascript
解决vue中无法动态修改jqgrid组件 url地址的问题
2018/03/01 Javascript
Vue实现侧边菜单栏手风琴效果实例代码
2018/05/31 Javascript
vue3.0 CLI - 2.4 - 新组件 Forms.vue 中学习表单
2018/09/14 Javascript
微信小程序wx.navigateTo中events属性实现页面间通信传值,数据同步
2019/07/13 Javascript
python paramiko实现ssh远程访问的方法
2013/12/03 Python
APIStar:一个专为Python3设计的API框架
2018/09/26 Python
Python如何使用OS模块调用cmd
2020/02/27 Python
Python爬虫爬取电影票房数据及图表展示操作示例
2020/03/27 Python
浅析Python的命名空间与作用域
2020/11/25 Python
css3选择器基本介绍
2014/12/15 HTML / CSS
大学应届毕业生个人求职信
2013/09/23 职场文书
土木工程应届生自荐信
2013/09/24 职场文书
运动会方阵解说词
2014/02/12 职场文书
《长征》教学反思
2014/04/27 职场文书
关于保护环境的标语
2014/06/09 职场文书
个人授权委托书范本
2014/09/14 职场文书
初中生物教学反思
2016/02/20 职场文书
Oracle11g r2 卸载干净重装的详细教程(亲测有效已重装过)
2021/06/04 Oracle
Python还能这么玩之只用30行代码从excel提取个人值班表
2021/06/05 Python
java.util.NoSuchElementException原因及两种解决方法
2022/06/28 Java/Android