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 相关文章推荐
sina的lightbox效果。
Jan 09 Javascript
简单的前端js+ajax 购物车框架(入门篇)
Oct 29 Javascript
setInterval,setTimeout与jquery混用的问题
Apr 08 Javascript
JS实现商品倒计时实现代码
May 03 Javascript
全屏js头像上传插件源码高清版
Mar 29 Javascript
javascript常见数字进制转换实例分析
Apr 21 Javascript
jquery自适应布局的简单实例
May 28 Javascript
jQuery焦点图左右转换效果
Dec 12 Javascript
微信小程序 用户数据解密详细介绍
Jan 09 Javascript
js仿iphone秒表功能 计算平均数
Jan 11 Javascript
JS触摸与手势事件详解
May 09 Javascript
解读ES6中class关键字
Nov 20 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伪造referer突破网盘禁止外连的代码
2008/06/15 PHP
mysql下创建字段并设置主键的php代码
2010/05/16 PHP
PHP+Mysql基于事务处理实现转账功能的方法
2015/07/08 PHP
PHP单例模式与工厂模式详解
2017/08/29 PHP
PHP实现基于栈的后缀表达式求值功能
2017/11/10 PHP
asp函数split()对应php函数explode()
2019/02/27 PHP
PHP 实现 WebSocket 协议原理与应用详解
2020/04/22 PHP
Javascript 学习书 推荐
2009/06/13 Javascript
Bootstrap入门书籍之(一)排版
2016/02/17 Javascript
Bootstrap每天必学之工具提示(Tooltip)插件
2016/04/26 Javascript
详解JavaScript中this关键字的用法
2016/05/26 Javascript
jQuey将序列化对象在前台显示地实现代码(方法总结)
2016/12/13 Javascript
JavaScript 实现 Tab 点击切换实例代码
2017/03/25 Javascript
JS简单获取并修改input文本框内容的方法示例
2018/04/08 Javascript
分享5个小技巧让你写出更好的 JavaScript 条件语句
2018/10/20 Javascript
迅速了解一下ES10中Object.fromEntries的用法使用
2019/03/05 Javascript
基于ts的动态接口数据配置的详解
2019/12/18 Javascript
javascript+css实现俄罗斯方块小游戏
2020/06/28 Javascript
Python提示[Errno 32]Broken pipe导致线程crash错误解决方法
2014/11/19 Python
简单总结Python中序列与字典的相同和不同之处
2016/01/19 Python
Python Socket实现简单TCP Server/client功能示例
2017/08/05 Python
python3使用smtplib实现发送邮件功能
2018/05/22 Python
python3.7 使用pymssql往sqlserver插入数据的方法
2019/07/08 Python
Flask框架单例模式实现方法详解
2019/07/31 Python
6行Python代码实现进度条效果(Progress、tqdm、alive-progress​​​​​​​和PySimpleGUI库)
2020/01/06 Python
使用TFRecord存取多个数据案例
2020/02/17 Python
python自动点赞功能的实现思路
2020/02/26 Python
Python timeit模块原理及使用方法
2020/10/10 Python
基于css3 animate制作绚丽的动画效果
2015/11/24 HTML / CSS
挪威手表购物网站:Klokker
2016/09/19 全球购物
华硕新加坡官方网上商店:ASUS Singapore
2020/07/09 全球购物
新闻专业推荐信范文
2013/11/20 职场文书
Python django中如何使用restful框架
2021/06/23 Python
详解在OpenCV中如何使用图像像素
2022/03/03 Python
Python+OpenCV实现在图像上绘制矩形
2022/03/21 Python
不想升级Win11?教你彻底锁定老版Windows系统的方法(附下载地址)
2022/09/23 数码科技