千鋒長沙前端培訓分享之JavaScript中Slice的用例
slice() 方法將數組部分的副本返回到新的數組對象中。這個對象是從頭到尾選擇的。請注意,它不會修改原始數組。此外,如果向其中一個數組添加新元素,則另一個數組不會受到影響。
參數是什么?slice() 方法的參數是開始和結束索引。開始它是一個從零開始的索引,用于開始復制數組的一部分。如果未定義,則默認值為 0。如果 start 大于數組的索引范圍, slice() 方法將返回一個空數組。此外,首先,您還可以使用負索引。slice(-1) 提取數組的最后一個元素。它類似于 Python。
結尾該參數是可選的。如果你的 slice() 函數中只有一個參數,那就是 start。如果省略, slice() 方法從序列的末尾提取。
如果它大于序列的長度,slice 一直提取到序列的末尾,只是在它被省略的情況下。它是結束提取之前的索引。它不包括在內。因此,索引的最后一個元素不包含在數組的副本中。例如, slice(1,3) 提取第二個和第三個元素。
y = [1, 2, 3, 4, 5, 6]
y.slice(2, -2) // will return [3, 4]
這意味著 y 會將數組從索引 2 切片到索引 -2 獨占。
1、復制一個數組
第一個功能是 slice() 函數的基本功能。沒有參數的數組復制原始數組。有時,您可能想要更新數組中的某些元素。
但是,您可能希望保護原始數組中的元素。因此,您可以創建原始數組的淺表副本。
const midtermGrades=updatedGrades.slice();
2、構造一個以n開頭的子數組
slice() 方法的第二個用例是復制以 n 開頭的子數組。例如,您正在分析從考試中獲得 80 分或更高分的學生。您發現學生的索引從 10 開始。
因此,您可以復制成功學生的索引。
const successfulStudents = allStudents.slice(10);
你也可以得到不滿意的學生。
const unsatisfactoryStudents = allStudents.slice(-10);
3、將類數組對象轉換為數組
您可以使用 slice() 方法將看起來像數組的對象轉換為數組。例如,您可以按如下方式創建函數。
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 轉換為數組。
var p = document.querySelectorAll(‘p’);
var pNodes = Array.prototype.slice.call(p);
5、替換字符串中的特定索引
您可以使用 slice() 函數創建替換函數。
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 轉換為數組
替換字符串中的特定索引

猜你喜歡LIKE
最新文章NEW
相關推薦HOT
更多>>熱門推薦
零基礎必看的前端HTML+CSS教程
沸Java培訓新手實戰必備!單機版坦克大戰分步實現項目源碼
熱3種Javascript圖片預加載的方法詳解
熱長沙前端培訓:一招教你用vue3+canvas實現坦克大戰
新互聯網涼了?參加長沙Java培訓能找到工作嗎?
長沙Java培訓實戰項目,出游咨詢訂票系統開發流程
不參加長沙Java培訓能學會Java嗎?2022Java技能學習路線圖
千鋒長沙Java培訓分享之怎么學習Java集合?
千鋒長沙前端培訓分享之JavaScript面向對象編程思想詳解
千鋒長沙前端培訓分享之web前端的回流和重繪
千鋒長沙前端培訓分享之3種Javascript圖片預加載的方法詳解
千鋒長沙前端培訓分享之利用Jest測試React組件
千鋒長沙前端培訓分享之JavaScript中Slice的用例
千鋒長沙java培訓分享之Socket編程