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 相关文章推荐
Jquery仿淘宝京东多条件筛选可自行结合ajax加载示例
Aug 28 Javascript
javascript定义变量时带var与不带var的区别分析
Jan 12 Javascript
深入解析JavaScript的闭包机制
Oct 20 Javascript
JS实现的手机端精简幻灯片效果
Sep 05 Javascript
canvas学习之API整理笔记(二)
Dec 29 Javascript
详解使用vue-router进行页面切换时滚动条位置与滚动监听事件
Mar 08 Javascript
canvas实现刮刮卡效果
Mar 14 Javascript
禁止弹窗中蒙层底部页面跟随滚动的几种方法
Dec 07 Javascript
Vue父组件调用子组件事件方法
Feb 23 Javascript
vue axios重复点击取消上一次请求封装的方法
Jun 19 Javascript
解决vue-cli 打包后自定义动画未执行的问题
Nov 12 Javascript
详解JSON.stringify()的5个秘密特性
May 26 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数据库操作类代码(增,删,改,查)
2013/04/08 PHP
浅谈PHP中如何实现Hook机制
2017/11/14 PHP
PHP+Ajax实现的博客文章添加类别功能示例
2018/03/29 PHP
跟着JQuery API学Jquery 之二 属性
2010/04/09 Javascript
纯js实现遮罩层效果原理分析
2014/05/27 Javascript
node.js中的fs.link方法使用说明
2014/12/15 Javascript
浅谈Sticky组件的改进实现
2016/03/22 Javascript
JS组件Bootstrap ContextMenu右键菜单使用方法
2016/04/17 Javascript
JavaScript实现页面跳转的方式汇总
2016/05/16 Javascript
javascript使用闭包模拟对象的私有属性和方法
2016/10/05 Javascript
第一次接触神奇的Bootstrap
2016/10/14 Javascript
详解Vue路由开启keep-alive时的注意点
2017/06/20 Javascript
使用 electron 实现类似新版 QQ 的登录界面效果(阴影、背景动画、窗体3D翻转)
2018/10/23 Javascript
Angular事件之不同组件间传递数据的方法
2018/11/15 Javascript
详解从0开始搭建微信小程序(前后端)的全过程
2019/04/15 Javascript
基于mpvue小程序使用echarts画折线图的方法示例
2019/04/24 Javascript
微信小程序获取位置展示地图并标注信息的实例代码
2019/09/01 Javascript
[36:14]DOTA2上海特级锦标赛D组小组赛#1 EG VS COL第二局
2016/02/28 DOTA
python常用web框架简单性能测试结果分享(包含django、flask、bottle、tornado)
2014/08/25 Python
举例讲解如何在Python编程中进行迭代和遍历
2016/01/19 Python
Python3.2模拟实现webqq登录
2016/02/15 Python
详解Python编程中对Monkey Patch猴子补丁开发方式的运用
2016/05/27 Python
django进阶之cookie和session的使用示例
2018/08/17 Python
python os.listdir按文件存取时间顺序列出目录的实例
2018/10/21 Python
Python逐行读取文件内容的方法总结
2020/02/14 Python
python topk()函数求最大和最小值实例
2020/04/02 Python
python利用xlsxwriter模块 操作 Excel
2020/10/14 Python
纯css实现照片墙3D效果的示例代码
2017/11/13 HTML / CSS
NBA欧洲商店(法国):NBA Europe Store FR
2016/10/19 全球购物
高中学生评语大全
2014/04/25 职场文书
个人工作主要事迹
2014/05/08 职场文书
护士长2015年终工作总结
2015/04/24 职场文书
创建文明城市倡议书
2015/04/28 职场文书
如何做好员工培训计划?
2019/07/09 职场文书
ConditionalOnProperty配置swagger不生效问题及解决
2022/06/14 Java/Android
Apache POI操作批量导入MySQL数据库
2022/06/21 Servers