JS数组方法slice()用法实例分析


Posted in Javascript onJanuary 18, 2020

本文实例讲述了JS数组方法slice()用法。分享给大家供大家参考,具体如下:

slice()方法

slice(),它能基于当前数组中的一个或多个创建一个新数组。可以接受一或两个参数,即要返回的起始和结束位置。

一个参数:slice()方法返回从该参数指定位置开始到当前数组末尾的所有项。

两个参数:该方法返回起始和结束位置之间的项(但不包括结束位置的项)。

slice不会影响原始数组。

结束位置小于起始位置,返回空数组。

可以接受负数,用数组长度加上该负数来确定相应位置。

var arr = [1, 2, 3, 'a', 'b', 'c', 'd'];
Array.prototype.copySlice =function() {
  var newArr = [];
  var len = this.length;
  var argLen = arguments.length;
  if(arguments.length == 1) {//一个参数
    var startNum = arguments[0] > 0 ? arguments[0] : (len + arguments[0]);
    for(var i = startNum; i < len; i++) {
      newArr.push(arr[i]);
    }
  }
  else if(arguments.length == 2) {//两个参数
    var startNum = arguments[0] > 0 ? arguments[0] : (len + arguments[0]);
    var endNum = arguments[1] > 0 ? arguments[1] : (len + arguments[1]);
    if(startNum >= endNum) {//起始索引大于终止索引,返回[]
      return newArr;
    }
    else {
      for(var i = startNum; i < endNum; i++) {
        newArr.push(arr[i]);
      }
    }
  }
  return newArr;
};
console.log(arr.length); // 7
// 一个参数
console.log(arr.copySlice(2)); // [3, "a", "b", "c", "d"]
// 两个参数
console.log(arr.copySlice(3, 6));  //["a", "b", "c"]
console.log(arr);  //[1, 2, 3, "a", "b", "c", "d"]
// 接收负数
console.log(arr.copySlice(-2)); // ["c", "d"]
console.log(arr.copySlice(-5, 6)); //[3, "a", "b", "c"]
//结束位置小于起始位置,返回空数组。
console.log(arr.copySlice(-5, -6)); //[]
console.log(arr.copySlice(5, 5)); //[]
console.log(arr.copySlice(5, )); // ["c", "d"]

运行结果:

JS数组方法slice()用法实例分析

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
javascript 显示当前系统时间代码
Dec 28 Javascript
js 创建快捷方式的代码(fso)
Nov 19 Javascript
多浏览器兼容性比较好的复制到剪贴板的js代码
Oct 09 Javascript
jQuery循环滚动展示代码 可应用到文字和图片上
May 11 Javascript
offsetHeight在OnLoad中获取为0的现象
Jul 22 Javascript
jQuery结合AJAX之在页面滚动时从服务器加载数据
Jun 30 Javascript
jquery判断复选框选中状态以及区分attr和prop
Dec 18 Javascript
Bootstrap入门书籍之(零)Bootstrap简介
Feb 17 Javascript
javaScript 事件绑定、事件冒泡、事件捕获和事件执行顺序整理总结
Oct 10 Javascript
ES6中定义类和对象的方法示例
Jul 31 Javascript
JS一次前端面试经历记录
Mar 19 Javascript
element中Steps步骤条和Tabs标签页关联的解决
Dec 08 Javascript
JS实现横向轮播图(中级版)
Jan 18 #Javascript
vue.js+ElementUI实现进度条提示密码强度效果
Jan 18 #Javascript
JS数组方法concat()用法实例分析
Jan 18 #Javascript
JS实现纵向轮播图(初级版)
Jan 18 #Javascript
JS数组方法reverse()用法实例分析
Jan 18 #Javascript
JS实现横向轮播图(初级版)
Jun 24 #Javascript
JS数组方法shift()、unshift()用法实例分析
Jan 18 #Javascript
You might like
上海地方志办公室-上海电子仪表工业志
2021/03/04 无线电
php进行ip地址掩码运算处理的方法
2016/07/11 PHP
php 命名空间(namespace)原理与用法实例小结
2019/11/13 PHP
jqeury eval将字符串转换json的方法
2011/01/20 Javascript
javascript学习笔记(五)正则表达式
2011/04/08 Javascript
Jquery 获取checkbox的checked问题
2011/11/16 Javascript
用正则表达式替换图片地址img标签
2013/11/22 Javascript
JavaScript生成随机字符串的方法
2015/03/19 Javascript
如何用javascript计算文本框还能输入多少个字符
2015/07/29 Javascript
纯js代码实现未知宽高的元素在指定元素中垂直水平居中显示
2015/09/12 Javascript
JavaScript模块化开发之SeaJS
2015/12/13 Javascript
JavaScript和jquery获取父级元素、子级元素、兄弟元素的方法
2016/06/05 Javascript
Vue.js快速入门实例教程
2016/10/15 Javascript
新手学习前端之js模仿淘宝主页网站
2016/10/31 Javascript
基于vue.js轮播组件vue-awesome-swiper实现轮播图
2017/03/17 Javascript
浅谈sass在vue注意的地方
2017/08/10 Javascript
Angularjs中date过滤器失效的问题及解决方法
2018/07/06 Javascript
微信小程序页面间跳转传参方式总结
2019/06/13 Javascript
解决vue 退出动画无效的问题
2020/08/09 Javascript
vue Treeselect下拉树只能选择第N级元素实现代码
2020/08/31 Javascript
python调用cmd命令行制作刷博器
2014/01/13 Python
python之wxPython应用实例
2014/09/28 Python
Python从MP3文件获取id3的方法
2015/06/15 Python
Python实现的堆排序算法原理与用法实例分析
2017/11/22 Python
docker django无法访问redis容器的解决方法
2019/08/21 Python
Python中最好用的命令行参数解析工具(argparse)
2019/08/23 Python
pytorch VGG11识别cifar10数据集(训练+预测单张输入图片操作)
2020/06/24 Python
使用CSS3制作版头动画效果
2020/12/24 HTML / CSS
财务会计毕业生自荐信
2013/11/02 职场文书
五一手机促销方案
2014/03/08 职场文书
降消项目实施方案
2014/03/30 职场文书
排查整治工作方案
2014/06/09 职场文书
学生会生活部工作总结2015
2015/03/31 职场文书
幼儿园中班教学反思
2016/03/03 职场文书
2016年社区“6.26”禁毒日宣传活动总结
2016/04/05 职场文书
Python turtle实现贪吃蛇游戏
2021/06/18 Python