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 相关文章推荐
document.documentElement的一些使用技巧
Apr 18 Javascript
Jquery解析json数据详解
Dec 26 Javascript
js 处理数组重复元素示例代码
Dec 27 Javascript
js转化毫秒为时间格式代码
Apr 10 Javascript
javascript跨域总结之window.name实现的跨域数据传输
Nov 01 Javascript
第四章之BootStrap表单与图片
Apr 25 Javascript
浅谈jquery中使用canvas的问题
Oct 10 Javascript
Express框架之connect-flash详解
May 31 Javascript
微信小程序开发之实现自定义Toast弹框
Jun 08 Javascript
JS实现上传图片的三种方法并实现预览图片功能
Jul 14 Javascript
解决vue项目报错webpackJsonp is not defined问题
Mar 14 Javascript
element UI upload组件上传附件格式限制方法
Sep 04 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/03 咖啡文化
php处理文件的小例子(解压缩,删除目录)
2013/02/03 PHP
PHP判断上传文件类型的解决办法
2015/10/20 PHP
php/JS实现的生成随机密码(验证码)功能示例
2019/06/06 PHP
Javascript 判断 object 的特定类转载
2007/02/01 Javascript
JavaScript高级程序设计(第3版)学习笔记 概述
2012/10/11 Javascript
javascript 使用for循环时该注意的问题-附问题总结
2015/08/19 Javascript
js实现的黑背景灰色二级导航菜单效果代码
2015/08/24 Javascript
Node.js开发者必须了解的4个JS要点
2016/02/21 Javascript
jQuery+CSS实现一个侧滑导航菜单代码
2016/05/09 Javascript
解析javascript图片懒加载与预加载的分析总结
2016/10/27 Javascript
JavaScript中最常用的10种代码简写技巧总结
2017/06/28 Javascript
JS实现中文汉字按拼音排序的方法
2017/10/09 Javascript
微信小程序实现选项卡功能
2020/06/19 Javascript
小程序实现抽奖动画
2020/04/16 Javascript
微信小程序学习笔记之目录结构、基本配置图文详解
2019/03/28 Javascript
说说如何使用Vuex进行状态管理(小结)
2019/04/14 Javascript
微信小程序的授权实现过程解析
2019/08/02 Javascript
JS addEventListener()和attachEvent()方法实现注册事件
2021/01/11 Javascript
Python 条件判断的缩写方法
2008/09/06 Python
Python3.6简单操作Mysql数据库
2017/09/12 Python
Python实现采用进度条实时显示处理进度的方法
2017/12/19 Python
python 读取.csv文件数据到数组(矩阵)的实例讲解
2018/06/14 Python
python实现将多个文件分配到多个文件夹的方法
2019/01/07 Python
python 图像处理画一个正弦函数代码实例
2019/09/10 Python
Python 实现图片转字符画的示例(静态图片,gif皆可)
2020/11/05 Python
pandas抽取行列数据的几种方法
2020/12/13 Python
介绍CSS3使用技巧5个
2009/04/02 HTML / CSS
一款利用纯css3实现的360度翻转按钮的实例教程
2014/11/05 HTML / CSS
Web时代变迁及html5与html4的区别
2016/01/06 HTML / CSS
英国最大的百货公司:Harrods
2016/08/18 全球购物
Interhome丹麦:在线预订度假屋和公寓
2019/07/18 全球购物
Magee 1866官网:Donegal粗花呢外套和大衣专家
2019/11/01 全球购物
音乐专业自荐信
2014/02/07 职场文书
保险公司岗前培训工作总结
2015/10/24 职场文书
CSS中float高度塌陷问题的四种解决方案
2022/04/18 HTML / CSS