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 mouseover、mouseout停止事件冒泡的解决方案
Apr 07 Javascript
js简单实现让文本框内容逐个字的显示出来
Oct 22 Javascript
JQuery遍历DOM节点的方法
Jun 11 Javascript
js鼠标移动时禁止选中文字
Feb 19 Javascript
基于vue.js实现侧边菜单栏
Mar 20 Javascript
React入门教程之Hello World以及环境搭建详解
Jul 11 Javascript
js匿名函数使用&amp;传参(实例)
Sep 08 Javascript
seaJs使用心得之exports与module.exports的区别实例分析
Oct 13 Javascript
浅谈Vuex@2.3.0 中的 state 支持函数申明
Nov 22 Javascript
AngularJS集合数据遍历显示的实例
Dec 27 Javascript
el-input 标签中密码的显示和隐藏功能的实例代码
Jul 19 Javascript
微信公众号平台接口开发 菜单管理的实现
Aug 14 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
用PHP生成自己的LOG文件
2006/10/09 PHP
Yii框架关联查询with用法分析
2014/12/02 PHP
php-beanstalkd消息队列类实例分享
2017/07/19 PHP
PHP中常见的密码处理方式和建议总结
2018/10/14 PHP
PHP实现通过文本文件统计页面访问量功能示例
2019/02/13 PHP
推荐40个非常优秀的jQuery插件和教程【系列三】
2011/11/09 Javascript
jquery禁止输入数字以外的字符的示例(纯数字验证码)
2014/04/10 Javascript
JQuery中模拟image的ajaxPrefilter与ajaxTransport处理
2015/06/19 Javascript
javascript数据结构之双链表插入排序实例详解
2015/11/25 Javascript
jQuery Ajax 实现在html页面实时显示用户登录状态
2016/12/30 Javascript
Nodejs进阶:express+session实现简易登录身份认证
2017/04/24 NodeJs
使用travis-ci如何持续部署node.js应用详解
2017/07/30 Javascript
在一般处理程序(ashx)中弹出js提示语
2017/08/16 Javascript
vue2 v-model/v-text 中使用过滤器的方法示例
2019/05/09 Javascript
javascript+Canvas实现画板功能
2020/06/23 Javascript
JavaScript事件循环及宏任务微任务原理解析
2020/09/02 Javascript
[52:44]VGJ.T vs infamous Supermajor小组赛D组败者组第一轮 BO3 第一场 6.3
2018/06/04 DOTA
python正则表达式抓取成语网站
2013/11/20 Python
20招让你的Python飞起来!
2016/09/27 Python
python入门基础之用户输入与模块初认识
2016/11/14 Python
python机器学习案例教程——K最近邻算法的实现
2017/12/28 Python
浅谈python编译pyc工程--导包问题解决
2019/03/20 Python
Flask框架模板渲染操作简单示例
2019/07/31 Python
python设置环境变量的作用整理
2020/02/17 Python
纯HTML5+CSS3制作生日蛋糕(代码易懂)
2016/11/16 HTML / CSS
canvas压缩图片以及卡片制作的方法示例
2018/12/04 HTML / CSS
澳大利亚鞋仓库:Shoe Warehouse
2019/07/25 全球购物
美国隐形眼镜网上商店:Lens.com
2019/09/03 全球购物
Maxpeedingrods美国:高性能汽车零件
2020/02/14 全球购物
大学军训感言1000字
2014/02/25 职场文书
乡镇三项教育实施方案
2014/03/30 职场文书
中学生纪念九一八事变演讲稿
2014/09/14 职场文书
2015年信贷员工作总结
2015/04/28 职场文书
python 办公自动化——基于pyqt5和openpyxl统计符合要求的名单
2021/05/25 Python
简单介绍Python的第三方库yaml
2021/06/18 Python
Redis集群节点通信过程/原理流程分析
2022/03/18 Redis