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 相关文章推荐
javascript RadioButtonList获取选中值
Apr 09 Javascript
jquery 实现的全选和反选
Apr 15 Javascript
Prototype String对象 学习
Jul 19 Javascript
JQUBar 基于JQUERY的柱状图插件
Nov 23 Javascript
JQuery模板插件 jquery.tmpl 动态ajax扩展
Nov 10 Javascript
ToolTips JQEURY插件之简洁小提示框效果
Nov 19 Javascript
jQuery+canvas实现简单的球体斜抛及颜色动态变换效果
Jan 28 Javascript
Node.js开发者必须了解的4个JS要点
Feb 21 Javascript
JavaScript数据类型和变量_动力节点Java学院整理
Jun 26 Javascript
vue中SPA单页面应用程序详解
Nov 07 Javascript
vue2 设置router-view默认路径的实例
Sep 20 Javascript
koa2的中间件功能及应用示例
Mar 05 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
php侧拉菜单 漂亮,可以向右或者向左展开,支持FF,IE
2009/10/15 PHP
yii2使用gridView实现下拉列表筛选数据
2017/04/10 PHP
如何直接访问php实例对象中的private属性详解
2017/10/12 PHP
Laravel 错误提示本地化的实现
2019/10/22 PHP
jQuery(1.3.2) 7行代码搞定跟随屏幕滚动的层
2009/05/21 Javascript
JSON 教程 json入门学习笔记
2020/09/22 Javascript
JavaScript 的继承
2011/10/01 Javascript
jQuery动态添加 input type=file的实现代码
2012/06/14 Javascript
判断ie的两种简单方法
2013/08/12 Javascript
js在输入框屏蔽按键,只能键入数字的示例代码
2014/01/03 Javascript
常用jQuery选择器总结
2014/07/11 Javascript
js实现点击链接后延迟3秒再跳转的方法
2015/06/05 Javascript
学习JavaScript设计模式(继承)
2015/11/26 Javascript
jQuery实现的文字hover颜色渐变效果实例
2016/02/20 Javascript
Bootstrap3学习笔记(二)之排版
2016/05/20 Javascript
微信小程序 摇一摇抽奖简单实例实现代码
2017/01/09 Javascript
Bootstrap table使用方法记录
2017/08/23 Javascript
three.js 入门案例详解
2018/01/23 Javascript
小程序如何在不同设备上自适应生成海报的实现方法
2019/08/20 Javascript
Javascript查看大图功能代码实现
2020/05/07 Javascript
Python批量合并有合并单元格的Excel文件详解
2018/04/05 Python
Python3 导入上级目录中的模块实例
2019/02/16 Python
使用PyQtGraph绘制精美的股票行情K线图的示例代码
2019/03/14 Python
用python求一个数组的和与平均值的实现方法
2019/06/29 Python
使用Python在Windows下获取USB PID&amp;VID的方法
2019/07/02 Python
python笔记_将循环内容在一行输出的方法
2019/08/08 Python
pytorch快速搭建神经网络_Sequential操作
2020/06/17 Python
canvas裁剪clip()函数的具体使用
2018/03/01 HTML / CSS
教师自我鉴定
2013/12/13 职场文书
消防安全检查制度
2014/02/04 职场文书
租房协议书
2014/04/10 职场文书
三严三实对照检查材料
2014/08/25 职场文书
公司合作协议范文
2014/10/01 职场文书
综合管理员岗位职责
2015/02/11 职场文书
催款函范文
2015/06/24 职场文书
2016年学校十一国庆节活动总结
2016/04/01 职场文书