javascript Array.prototype.slice的使用示例


Posted in Javascript onNovember 14, 2013

经常的,可以看到Array.prototype.slice(arguments, 0); 这个写法可以用于function() {} 内,这样可以将函数的参数列表转换成一个真正的数组。请看一个例子:

var slice = Array.prototype.slice;
var toString = Object.prototype.toString;
(function() {
  var args = arguments;
  console.log(args, toString.call(args)); // [1, 2, 3] "[object Arguments]" 
  var argsArr = slice(args, 0);
  console.log(argsArr, toString.call(argsArr)); // [1, 2, 3] "[object Array]" 
}(1,2,3))

我们可以看到函数的参数列表arguments通过slice调用以后,一秒钟变Array了。
同样的,也可以将选中的DOM元素转换成数组:
slice.call(document.querySelectorAll("div"));

顺藤摸瓜,我们想想,slide方法是否可以将对象转换成数组呢?请看例子:
console.log(slice.call('string')); // ["s", "t", "r", "i", "n", "g"] 
console.log(slice.call(new String('string'))); // ["s", "t", "r", "i", "n", "g"]

每次,字符串会直接被转换成了一个数组。
但是,数字,布尔值的会转换成一个空的数组:
console.log(slice.call(33)); 
console.log(slice.call(true));

普通的对象也会被转换成空数组,除非你给它加上一个length属性:
console.log(slice.call({name: 'obj'})); // []
console.log(slice.call({0: 'zero', 1: 'one'})); // []
console.log(slice.call({0: 'zero', 1: 'one', name: 'obj', length: 2}));  // ["zero", "one"]

还有,它还可以用来clone数组:
var srcArr = [1,2,3];
var newArr = srcArr.slice(0);
console.log(srcArr, newArr);    // [1,2,3] [1,2,3]
console.log(srcArr == newArr);  // false
Javascript 相关文章推荐
js中top、clientTop、scrollTop、offsetTop的区别 文字详细说明版
Jan 08 Javascript
jQuery之网页换肤实现代码
Apr 30 Javascript
JavaScript数据操作_浅谈原始值和引用值的操作本质
Aug 23 Javascript
详解用vue编写弹出框组件
Jul 04 Javascript
React入门教程之Hello World以及环境搭建详解
Jul 11 Javascript
webpack热模块替换(HMR)/热更新的方法
Apr 05 Javascript
JS实现点击按钮可实现编辑功能
Jul 03 Javascript
Vue点击切换颜色的方法
Sep 13 Javascript
react配置antd按需加载的使用
Feb 11 Javascript
JS 图片压缩原理与实现方法详解
Apr 29 Javascript
jQuery AJAX应用实例总结
May 19 jQuery
node.js 基于 STMP 协议和 EWS 协议发送邮件
Feb 14 Javascript
js取消单选按钮选中示例代码
Nov 14 #Javascript
js实现目录定位正文示例
Nov 14 #Javascript
通过action传过来的值在option获取进行验证的方法
Nov 14 #Javascript
javascript间隔刷新的简单实例
Nov 14 #Javascript
Enter转换为Tab的小例子(兼容IE,Firefox)
Nov 14 #Javascript
js中prototype用法详细介绍
Nov 14 #Javascript
JavaScript图片放大技术(放大镜)实现代码分享
Nov 14 #Javascript
You might like
PHP中利用substr_replace将指定两位置之间的字符替换为*号
2011/01/27 PHP
php 注释规范
2012/03/29 PHP
yii2利用自带UploadedFile实现上传图片的示例
2017/02/16 PHP
PHP实现将标点符号正则替换为空格的方法
2017/08/09 PHP
Laravel多用户认证系统示例详解
2018/03/13 PHP
PHP实现简单计算器小程序
2020/08/28 PHP
PHP使用CURL实现下载文件功能示例
2019/06/03 PHP
JS 页面内容搜索,类似于 Ctrl+F功能的实现代码
2007/08/13 Javascript
jQuery Animation实现CSS3动画示例介绍
2013/08/14 Javascript
浮动的div自适应居中显示的js代码
2013/12/23 Javascript
浅谈JSON和JSONP区别及jQuery的ajax jsonp的使用
2014/11/23 Javascript
AngularJS 指令的交互详解及实例代码
2016/09/14 Javascript
js 动态生成json对象、时时更新json对象的方法
2016/12/02 Javascript
使用BootStrap实现表格隔行变色及hover变色并在需要时出现滚动条
2017/01/04 Javascript
Mac中安装nvm的教程分享
2017/12/11 Javascript
vue cli安装使用less的教程详解
2019/07/12 Javascript
JavaScript设计模式--简单工厂模式定义与应用案例详解
2020/05/23 Javascript
[56:41]iG vs Winstrike 2018国际邀请赛小组赛BO2 第二场
2018/08/17 DOTA
深入解析Python中的集合类型操作符
2015/08/19 Python
Django实现快速分页的方法实例
2017/10/22 Python
Anaconda下安装mysql-python的包实例
2018/06/11 Python
Django中的forms组件实例详解
2018/11/08 Python
python实现倒计时小工具
2019/07/29 Python
Python实现计算长方形面积(带参数函数demo)
2020/01/18 Python
Scrapy框架基本命令与settings.py设置
2020/02/06 Python
keras训练曲线,混淆矩阵,CNN层输出可视化实例
2020/06/15 Python
编程实现去掉XML的重复结点
2014/05/28 面试题
自我评价优秀范文分享
2013/11/30 职场文书
毕业生写求职信的要点
2014/03/04 职场文书
合作意向书格式及范文
2014/03/31 职场文书
局领导领导班子四风对照检查材料
2014/09/27 职场文书
2014年党风建设工作总结
2014/11/19 职场文书
立春观后感
2015/06/18 职场文书
幼儿园国培研修日志
2015/11/13 职场文书
2016秋季运动会开幕词
2016/03/04 职场文书
jQuery实现影院选座订座效果
2021/04/13 jQuery