17種面試前你需要知道的JavaScript 陣列方法

語言: CN / TW / HK

由於,我最近一直在申請軟體工程職位,因此我被要求進行評估以測試我的編碼能力,對我使用的的語言(如 C、C++、Java 和 JavaScript)進行評估時,我需要開發一種滿足提示的簡潔演算法。

為了準備這樣的測試,我自然而然地傾向於 JavaScript。這是一種非常靈活和寬容的語言。

本文的重點是強調我選擇在 JavaScript 中進行評估的主要原因之一:原生陣列方法。在本文中,我將建立一個快速備忘錄,以幫助您和我在未來的測試中取得好成績。

提示:如果您正在準備編碼面試,我真的鼓勵您在 CodeWars 練習您的開發技能。那裡的提示很容易成為我評估的提示之一。這非常相似。

說了這麼多,讓我們開始吧。

1、array.concat

let array1 = [1,2];
let array2 = [3,4];
let array3 = [5,6,7];
let array4 = array1.concat(array2, array3)
console.log(array4)// [1,2,3,4,5,6,7]

將兩個或多個數組連線成一個數組。

您可以在 concat 方法中擁有無限數量的引數。

還可以這樣做:

let array1 = [1,2];
let array2 = [3,4];
let array3 = [5,6,7];
let array4 = [...array1, ...array2]
console.log(array4);

2、array.length

var name = "Kyle";
console.log(name.length) // 4
var array = [1,2,3,4,5];
console.log(array.length); //5

用於獲取陣列或字串的長度

3、array.join

let students = ["Anthony", "Beth", "Cersi" , "Dario", "Elizabeth", "Farrah"];
let welcomeMessage = "Hello " + students.join(" and ")
console.log(welcomeMessage);
/* PRINTS
Hello Anthony and Beth and Cersi and Dario and Elizabeth and Farrah
*/

將陣列的元素連線在一起並將其轉換為字串

join方法的一個引數(分隔符)

例如,我們使用“和”來連線陣列中的所有元素。你可以使用空格“”或逗號“,”或任何你想要的。

4、array.pop

let students = ["Anthony", "Beth", "Cersi" , "Dario", "Elizabeth", "Farrah"];
let removed = students.pop();
console.log(removed); //Farrah
console.log(students); //["Anthony", "Beth", "Cersi" , "Dario", "Elizabeth"]
students.pop();
console.log(students); //["Anthony", "Beth", "Cersi" , "Dario"]

移除陣列最後的元素

該方法返回被移除的元素,這是可選的,您也可以單獨使用 students.pop() 。

5、array.push

let students = ["Anthony", "Beth", "Cersi" , "Dario", "Elizabeth", "Farrah"];
students.push("George");
console.log(students);
/* Prints: ["Anthony", "Beth", "Cersi" , "Dario", "Elizabeth", "Farrah", "George]
*/

在陣列末尾新增元素

6、array.shift

let students = ["Anthony", "Beth", "Cersi" , "Dario", "Elizabeth", "Farrah"];
students.shift();
console.log(students);
/*PRINTS:
["Beth", "Cersi" , "Dario", "Elizabeth", "Farrah"]
*/

刪除陣列最開始的元素。

7、array.unshift

let students = ["Anthony", "Beth", "Cersi" , "Dario", "Elizabeth", "Farrah"];
students.unshift("Zander");
console.log(students);
/*PRINTS:
["Zander", "Anthony", "Beth", "Cersi" , "Dario", "Elizabeth", "Farrah"]
*/

8、array.slice

var name = "Jennifer Aniston"
var firstName = name.slice(0,8);
console.log(firstName); //Jennifer
var array = [1,2,3,4,5,6,7];
console.log(array.slice(0,3)); //[1,2,3]
var array = ["Index 1", "Index 2", "Index 3", "Index 4"];
console.log(array.slice(1)); //[ 'Index 2', 'Index 3', 'Index 4' ]
  •  返回從開始索引到結束索引的元素(加一)
  •  不改變原始陣列

切片方法的一個引數

  •  提取從給定索引開始直到陣列末尾的元素。

切片方法的兩個引數:(開始索引,結束索引+1)

  •  提取從給定索引(第一個引數)開始到給定索引(第二個引數)結束的元素
  •  由於我們要提取“Jennifer”,我們從索引 0 開始。Jennifer 的最後一個字母在索引 7 處。所以第二個引數將是 8

9、array.splice

let array1 = [1,2,3,6,7,6,7,8,9];
array1.splice(3, 6)
console.log(array1); //[ 1, 2, 3 ]

用於新增、刪除或替換陣列中的元素

拼接方法的兩個引數

  •  第一個引數是要新增、刪除或替換元素的索引
  •  第二個引數是要從第一個引數中提到的索引開始的陣列中刪除的元素數
  •  例如,我們想在第一個引數中定義的索引 3 處開始新增、刪除或替換陣列中的元素。(請記住,陣列使用從零開始的索引)。我們將刪除第二個引數中定義的 6 個元素。
let array1 = [1,2,3,6,7,6,7,8,9];
array1.splice(3, 2, 4, 5 )
console.log(array1); // [1,2,3,4,5,6,7,8,9]

拼接方法的三個或更多引數

  •  第一個引數是要新增、刪除或替換元素的索引
  •  第二個引數是要從第一個引數中提到的索引開始的陣列中刪除的元素數
  •  剩餘的引數(可以無限多)將從第一個引數中提到的索引開始插入到陣列中
  •  例如,我們想在第一個引數中定義的索引 3 處開始新增、刪除或替換陣列中的元素。(請記住,陣列使用從零開始的索引)。我們將刪除第二個引數中定義的 2 個元素。這將使陣列位於 [1,2,3,6,7,8,9]。然後,在第一個引數中定義的索引 3 處,我們將插入由其餘引數指定的值。在這種情況下,我們有第三個和第四個引數。我們在索引 3 處插入這兩個。顯然,如果我們有第三、第四、第五、、、、、、、、和第二十個引數,我們將插入所有這些引數。

10、array.reverse

let array1 = [1,2,3,6,7,6,7,8,9];
console.log(array1.reverse()); // [ 9, 8, 7, 6, 7, 6, 3, 2, 1 ]

反轉陣列的順序

11、array.sort()

//升序排序
let array1 = [5, 1, 8, 3];
array1.sort((a, b) =>  a-b);
console.log(array1) //[ 1, 3, 5, 8 ]
//遞減數字排序
let array1 = [5, 1, 8, 3];
array1.sort((a, b) =>  b-a);
console.log(array1) //[ 8, 5, 3, 1 ]
//遞減數字排序
let array1 = [5, 1, 8, 3];
array1.sort((a, b) =>  a-b).reverse();
console.log(array1) //[ 8, 5, 3, 1 ]
//升序字母排序
let array1 = ["apples", "carrots", "zendaya", "tapioca"];
array1.sort();
console.log(array1)
//降序字母排序
let array1 = ["apples", "carrots", "zendaya", "tapioca"];
array1.sort().reverse();
console.log(array1)

字串方法

12、string.concat

let name = "Kyle";
let age = 21;
let city = "Los Angeles"
let sentence = name.concat(" is " , age , " years old and lives in ", city);
console.log(sentence);

將兩個或多個字串連線成一個字串。

您可以在 concat 方法中擁有無限數量的引數。您也可以用 + 代替 ,它分隔每個字串/變數

13、string.indexOf

let sentence = "Publish today on Medium";
console.log(sentence.indexOf("today")) //8

查詢字串第一次出現的索引

如果未找到字串,則返回 -1

14、string.lastIndexOf

let sentence = "a dog went to a dog park on a tuesday night. ";
console.log(sentence.lastIndexOf("a ")); //28

查詢字串最後一次出現的索引

如果未找到字串,則返回 -1

15、string.split

let name = "Kyle DeGuzman";
let nameArray = name.split(" ");
console.log(nameArray) //['Kyle', 'DeGuzman']
let alphabet = "abcdefghijklmnopqrstuv";
let alphabetArray = alphabet.split("");
console.log(alphabetArray) //['a','b','c','d','e','f','g','h'....]
let favoriteThings = "Raindrops on Roses, Whiskers on Kittens, Bright Copper Kettles, Warm Woolen Mittens, Brown Paper Packages Tied Up With String";
let favoriteThingsArray = favoriteThings.split(",");
console.log(favoriteThingsArray)

將字串轉換為陣列

拆分方法的一個引數(分隔符)

  •  分隔符定義了在字串中進行切割的位置
  •  例如,第一個分割在空間上進行切割。因此,結果在每個空間都被拆分。
  •  例如,第二次拆分在“”處進行了剪下,基本上在每個字元之間。
  •  例如,只要有逗號,第三個拆分就會進行切割。

16、string.toLowerCase()

let name = "kYle";
let name = name.toLowerCase();  
console.log(name); //kyle
let string = ("triumph").toLowerCase();  
console.log(string); //triumph

將字串中的所有字母轉換為小寫

如果您正在測試使用者輸入的字串,這非常棒。

例如:

if (input == "apple"){
...
}

所以如果使用者輸入Apple、aApple、appLE等,它們將是無效的。

if (input.toLowerCase() == "apple"){
}

這是一個更好的方法

17、string.toUpperCase()

let name = "kYle";
let name = name.toUpperCase();  
console.log(name); //KYLE
let string = ("triumph").toUpperCase();  
console.log(string); //TRIUMPH

將字串中的所有字母轉換為大寫

18、string.trim

let firstName = "Kyle\n\n\n\n";
let lastName = "Deguzman      ";
console.log(firstName + lastName);
console.log(firstName.trim() + lastName)

從字串的左側和右側刪除空格。

以上就是我今天整理的18個關於JavaScript陣列的方法,希望你能從這個清單列表中學習到新知識,如果你覺得我今天的內容對你有幫助的話,請記得點讚我,關注我,並將它分享給你身邊的朋友,也許能夠幫助到他。

當然,這個清單列表也只是其中的一部分而已,如果你還有要補充的知識內容,歡迎你在留言區給我留言。

最後,感謝你的閱讀,祝程式設計愉快!