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  Error 对象 错误处理
May 18 Javascript
JavaScript格式化数字的函数代码
Nov 30 Javascript
基于Jquery插件开发之图片放大镜效果(仿淘宝)
Nov 19 Javascript
jQuery简单实现网页选项卡特效
Nov 24 Javascript
Bootstrap中glyphicons-halflings-regular.woff字体报404错notfound的解决方法
Jan 19 Javascript
JS验证input输入框(字母,数字,符号,中文)
Mar 23 Javascript
javascript用rem来做响应式开发
Jan 13 Javascript
浅谈Vue.js中如何实现自定义下拉菜单指令
Jan 06 Javascript
javascript数据类型中的一些小知识点(推荐)
Apr 18 Javascript
解决vue 单文件组件中样式加载问题
Apr 24 Javascript
微信小程序实现Session功能及无法获取session问题的解决方法
May 07 Javascript
JS正则表达式验证密码强度
Mar 18 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制作静态网站的模板框架(二)
2006/10/09 PHP
php file_put_contents()功能函数(集成了fopen、fwrite、fclose)
2011/05/24 PHP
PHP判断网络文件是否存在的方法
2015/03/12 PHP
wordpress安装过程中遇到中文乱码的处理方法
2015/04/21 PHP
Laravel构建即时应用的一种实现方法详解
2017/08/31 PHP
PHP抽象类和接口用法实例详解
2019/07/20 PHP
php redis setnx分布式锁简单原理解析
2020/10/23 PHP
推荐自用 Javascript 缩图函数 (onDOMLoaded)……
2007/10/23 Javascript
javascript cookie操作类的实现代码小结附使用方法
2010/06/02 Javascript
基于jQuery实现的Ajax 验证用户名是否存在的实现代码
2011/04/06 Javascript
使用jquery hover事件实现表格的隔行换色功能示例
2013/09/03 Javascript
jQuery轮播图效果精简版完整示例
2016/09/04 Javascript
15个非常实用的JavaScript代码片段
2016/12/18 Javascript
如何用webpack4带你实现一个vue的打包的项目
2018/06/20 Javascript
Webpack4 使用Babel处理ES6语法的方法示例
2019/03/07 Javascript
JS实现公告上线滚动效果
2021/01/10 Javascript
[02:46]完美世界DOTA2联赛PWL DAY4集锦
2020/11/03 DOTA
[45:59]完美世界DOTA2联赛PWL S2 FTD vs GXR 第二场 11.22
2020/11/24 DOTA
使用Python脚本将Bing的每日图片作为桌面的教程
2015/05/04 Python
关于Python中浮点数精度处理的技巧总结
2017/08/10 Python
Python-OpenCV基本操作方法详解
2018/04/02 Python
Python常见字典内建函数用法示例
2018/05/14 Python
使用python画个小猪佩奇的示例代码
2018/06/06 Python
python+selenium 定位到元素,无法点击的解决方法
2019/01/30 Python
python接口自动化(十七)--Json 数据处理---一次爬坑记(详解)
2019/04/18 Python
详解Python 切片语法
2019/06/10 Python
Python numpy多维数组实现原理详解
2020/03/10 Python
利用4行Python代码监测每一行程序的运行时间和空间消耗
2020/04/22 Python
tensorflow实现残差网络方式(mnist数据集)
2020/05/26 Python
Keras 加载已经训练好的模型进行预测操作
2020/06/17 Python
python图片验证码识别最新模块muggle_ocr的示例代码
2020/07/03 Python
python SOCKET编程基础入门
2021/02/27 Python
京东奢侈品:全球奢侈品牌
2018/03/17 全球购物
会计学毕业生求职信
2014/06/25 职场文书
党员群众路线学习心得体会
2014/11/04 职场文书
十大最强妖精系宝可梦,哲尔尼亚斯实力最强,第五被称为大力士
2022/03/18 日漫