JS中使用Array函数shift和pop创建可忽略参数的例子


Posted in Javascript onMay 28, 2014

在 JS Array 中支持两个方法,shift() 和 pop(),分别是指从一个数据中的最前面和最后面删除一个值,并返删除值。看一个示例就明白了:

var arr = ['s','o','f','i','s','h'];
arr.shift(); // 返回 's'
arr; // 目前是 ['o','f','i','s','h']
arr.pop() // 返回 'h'
arr // 目前是 ['o','f','i','s']

在很多 JS 框架中可以很常见的是,一个方法提供你传几个参数,而这些参数中,部分是可以忽略的,这些可以忽略的点可能是第一个,也可能是最后一个。传统的写法是判断参数有没有存在,或者参数的个数来决定最终取值。

这里,我们可以利用函数的 arguments 对象,以及 Array 中的 shift 和 pop 来实现灵活的应用。

一、使用 shift
如何实现一个 .bind() 方法,让 fn api 如下:

// fn 的作用域限定于 object 下
// 除 object 外,所有 bind 方法的参数都将传给 fn
fn.bind(object, param1, param2, [, paramN]);

看一个实例先。当然,这例子可能更为重要的是 call和 apply 的应用。不过,我们想要说的是 shift 的应用:
// 来自 Prototype.js 的 [`.bind`](http://www.prototypejs.org/api/function/bind) 方法
Function.prototype.bind = function(){
  var fn = this,
      args = Array.prototype.slice.call(arguments),
      object = args.shift();
  return function(){
      return fn.apply(object,
          args.concat(Array.prototype.slice.call(arguments)));
      };
};

我们可以利用对 arguments 对象(array-like object,需要转换成真正的 array)进行 shift 来取出,像这个方法,主要利用它们来分出作为作用域的 object,然后巧妙地把余下的参数数组传给 fn,即调用我们想限定到 object 作用域内的函数。

二、使用 pop
最近在试用 seajs,我们就拿它的一个 api 来说吧:

define(id, dependencies, callback)

这个定义一个模块的 api,id 和 dependencies 都是可以省略的。这里,如何实现这个支持呢?如果使用 if 来判断,真就得 if (arguments === 1) {...} elseif ... 一大堆了。当然,这样有时候也有好处的(?,想想)。这里,我们可能用来 pop 来方便实现这样的支持:
var define = function(){
    // 取出这个 callback
    var args = [].slice.call(arguments)
        fn = args.pop();
    // 做点其他神马事
        fn.apply(null, args)
    // ...
    },
    callback = function(){
        var args = arguments, i = 0, len = args.length;
        if(len === 0) console.log('只有一个 callback');
        for(;i<len;i++) {
            console.log(args[i]);
        }
    }
// 看看他们三个的执行结果
define(callback);
define('有两个参数', callback);
define('有三个参数', 'hello world', callback);

前两天和同事除到一些 JS 中的技巧时引用的一个东西。虽然总叫自己不要太沉浸于代码中,但代码,不仅仅是 JS,总是给我们太多乐趣。如何不喜欢。哈哈。
Javascript 相关文章推荐
js动态往表格的td中添加图片并注册事件
Jun 12 Javascript
一个获取第n个元素节点的js函数
Sep 02 Javascript
jQuery中focus事件用法实例
Dec 26 Javascript
javascript实现的简单计时器
Jul 19 Javascript
Bootstrap Metronic完全响应式管理模板之菜单栏学习笔记
Jul 08 Javascript
BootStrop前端框架入门教程详解
Dec 25 Javascript
Bootstrap的Carousel配合dropload.js实现移动端滑动切换图片
Mar 10 Javascript
jquery事件与绑定事件
Mar 16 Javascript
Easy UI动态树点击文字实现展开关闭功能
Sep 30 Javascript
使用vuex缓存数据并优化自己的vuex-cache
May 30 Javascript
JS实现点击按钮可实现编辑功能
Jul 03 Javascript
react 国际化的实现代码示例
Sep 14 Javascript
现代 JavaScript 开发编程风格Idiomatic.js指南中文版
May 28 #Javascript
node.js Web应用框架Express入门指南
May 28 #Javascript
用html5 js实现点击一个按钮达到浏览器全屏效果
May 28 #Javascript
浅析JavaScript基本类型与引用类型
May 28 #Javascript
最短的IE判断var ie=!-[1,]分析
May 28 #Javascript
jQuery 1.9使用$.support替代$.browser的使用方法
May 27 #Javascript
什么是cookie?js手动创建和存储cookie
May 27 #Javascript
You might like
几种显示数据的方法的比较
2006/10/09 PHP
PHP配置文件中最常用四个ini函数
2007/03/19 PHP
把1316这个数表示成两个数的和,其中一个为13的倍数,另一个是11的倍数,求这两个数。
2011/06/24 PHP
PHP中static关键字原理的学习研究分析
2011/07/18 PHP
php下载文件的代码示例
2012/06/29 PHP
PHP设计模式之工厂模式定义与用法详解
2018/04/03 PHP
跨浏览器开发经验总结(三)   警惕“IE依赖综合症”
2010/05/13 Javascript
通过javascript的匿名函数来分析几段简单有趣的代码
2010/06/29 Javascript
javascript打印输出json实例
2013/11/11 Javascript
JavaScript导出Excel实例详解
2014/11/25 Javascript
Node.js中child_process实现多进程
2015/02/03 Javascript
jQuery设置和移除文本框默认值的方法
2015/03/09 Javascript
javascript 定时器工作原理分析
2016/12/03 Javascript
jquery与js实现全选功能的区别
2017/06/11 jQuery
用js屏蔽被http劫持的浮动广告实现方法
2017/08/10 Javascript
JS实现带导航城市列表以及输入搜索功能
2018/01/04 Javascript
React Navigation 使用中遇到的问题小结
2018/05/08 Javascript
JavaScript中join()、splice()、slice()和split()函数用法示例
2018/08/24 Javascript
vue组件数据传递、父子组件数据获取,slot,router路由功能示例
2019/03/19 Javascript
浅谈layui分页控件field参数接收对象的问题
2019/09/20 Javascript
Vue开发中遇到的跨域问题及解决方法
2020/02/11 Javascript
适用于 Vue 的播放器组件Vue-Video-Player操作
2020/11/16 Javascript
[30:51]DOTA2上海特级锦标赛主赛事日 - 3 胜者组第二轮#1Liquid VS MVP.Phx第一局
2016/03/04 DOTA
[15:07]lgd_OG_m2_BP
2019/09/10 DOTA
跟老齐学Python之大话题小函数(2)
2014/10/10 Python
Python基于Tkinter实现的记事本实例
2015/06/17 Python
python保存二维数组到txt文件中的方法
2018/11/15 Python
Python 限制线程的最大数量的方法(Semaphore)
2019/02/22 Python
美国二手复古奢侈品包包购物网站:LXRandCo
2019/06/18 全球购物
英国领先的酒杯和水晶玻璃器皿制造商:Dartington Crystal
2019/06/23 全球购物
实习生个人找工作的自我评价
2013/10/30 职场文书
企业内控岗位的职责
2014/02/07 职场文书
《乡下孩子》教学反思
2014/04/17 职场文书
民主生活会发言材料
2014/10/20 职场文书
2015年高考寄语或鼓励的话
2015/03/23 职场文书
毕业设计致谢语
2015/05/14 职场文书