千锋教育-做有情怀、有良心、有品质的职业教育机构

手机站
千锋教育

千锋学习站 | 随时随地免费学

千锋教育

扫一扫进入千锋手机站

领取全套视频
千锋教育

关注千锋学习站小程序
随时随地免费学习课程

当前位置:首页  >  技术干货  > 5个JavaScript中Slice()的用例

5个JavaScript中Slice()的用例

来源:千锋教育
发布人:wjy
时间: 2022-06-01 11:54:00 1654055640

  slice() 方法将数组部分的副本返回到新的数组对象中。这个对象是从头到尾选择的。请注意,它不会修改原始数组。

  此外,如果向其中一个数组添加新元素,则另一个数组不会受到影响。

5个JavaScript中Slice的用例

  ## **参数是什么?**

  slice() 方法的参数是开始和结束索引。

  **开始**

  它是一个从零开始的索引,用于开始复制数组的一部分。如果未定义,则默认值为 0。如果 start 大于数组的索引范围, slice() 方法将返回一个空数组。

  此外,首先,您还可以使用负索引。slice(-1) 提取数组的最后一个元素。它类似于 Python。

  **结尾**

  该参数是可选的。如果你的 slice() 函数中只有一个参数,那就是 start。如果省略, slice() 方法从序列的末尾提取。

  如果它大于序列的长度,slice 一直提取到序列的末尾,只是在它被省略的情况下。

  它是结束提取之前的索引。它不包括在内。因此,索引的最后一个元素不包含在数组的副本中。例如, slice(1,3) 提取第二个和第三个元素。

  ```js

  y = [1, 2, 3, 4, 5, 6]

  y.slice(2, -2) // will return [3, 4]

  ```

  这意味着 y 会将数组从索引 2 切片到索引 -2 独占。

  ## **1、复制一个数组**

  第一个功能是 slice() 函数的基本功能。没有参数的数组复制原始数组。有时,您可能想要更新数组中的某些元素。

  但是,您可能希望保护原始数组中的元素。因此,您可以创建原始数组的浅表副本。

  ```js

  const midtermGrades=updatedGrades.slice();

  ```

  ## **2、构造一个以n开头的子数组**

  slice() 方法的第二个用例是复制以 n 开头的子数组。例如,您正在分析从考试中获得 80 分或更高分的学生。您发现学生的索引从 10 开始。

  因此,您可以复制成功学生的索引。

  ```js

  const successfulStudents = allStudents.slice(10);

  ```

  你也可以得到不满意的学生。

  ```js

  const unsatisfactoryStudents = allStudents.slice(-10);

  ```

  ## **3、将类数组对象转换为数组**

  您可以使用 slice() 方法将看起来像数组的对象转换为数组。例如,您可以按如下方式创建函数。

  ```js

  function TransformToArray(){

  return Array.prototype.slice.call(arguments);

  }

  var newArray = TransformToArray("1", "2", "3", "4");

  console.log(newArray); // ["1", "2", "3", "4"];

  ```

  ## **4、将一个NodeList转换成一个数组**

  NodeList 对象是从文档中提取的节点集合。您可以使用 querySelectorAll() 方法返回一个 NodeList 对象。

  例如,您可以选择 HTML 文档中的所有节点。使用 slice(),您可以将您选择的 NodeList 转换为数组。

  ```js

  var p = document.querySelectorAll(‘p’);

  var pNodes = Array.prototype.slice.call(p);

  ```

  ## **5、替换字符串中的特定索引**

  您可以使用 slice() 函数创建替换函数。

  ```js

  String.prototype.append = function (index,value) {

  return this.slice(0,index) + value + this.slice(index);

  };

  var s = "Happy year";

  alert(s.append(6,"new "));

  ```

  ## **结论**

  学习 JavaScript 内置函数的用例可以帮助您提高编码技能。您可以在需要时使用您的知识。您可以优雅地实现功能。

  slice() 也是一个有用的内置函数。如果您知道如何使用它,则可以在遇到需要使用它的问题时使用它。您可以使用 slice() 轻松获取数组的副本。

  **总结一下,本文中 slice() 的用例如下:**

  - 复制数组

  - 构造一个从 n 开始的子数组

  - 将类数组对象转换为数组

  - 将 NodeList 转换为数组

  - 替换字符串中的特定索引

  **- End -**

  更多关于“html5培训”的问题,欢迎咨询千锋教育在线名师。千锋已有十余年的培训经验,课程大纲更科学更专业,有针对零基础的就业班,有针对想提升技术的提升班,高品质课程助理你实现梦想。

tags:
声明:本站稿件版权均属千锋教育所有,未经许可不得擅自转载。
10年以上业内强师集结,手把手带你蜕变精英
请您保持通讯畅通,专属学习老师24小时内将与您1V1沟通
免费领取
今日已有369人领取成功
刘同学 138****2860 刚刚成功领取
王同学 131****2015 刚刚成功领取
张同学 133****4652 刚刚成功领取
李同学 135****8607 刚刚成功领取
杨同学 132****5667 刚刚成功领取
岳同学 134****6652 刚刚成功领取
梁同学 157****2950 刚刚成功领取
刘同学 189****1015 刚刚成功领取
张同学 155****4678 刚刚成功领取
邹同学 139****2907 刚刚成功领取
董同学 138****2867 刚刚成功领取
周同学 136****3602 刚刚成功领取
相关推荐HOT
开班信息
北京校区
  • 北京校区
  • 大连校区
  • 广州校区
  • 成都校区
  • 杭州校区
  • 长沙校区
  • 合肥校区
  • 南京校区
  • 上海校区
  • 深圳校区
  • 武汉校区
  • 郑州校区
  • 西安校区
  • 青岛校区
  • 重庆校区
  • 太原校区
  • 沈阳校区
  • 南昌校区
  • 哈尔滨校区