建站教程

建站教程

Products

当前位置:首页 > 建站教程 >

17种面试前你需要知道的JavaScript 数组方法(js数组slice()的具体用法介绍)

GG网络技术分享 2025-03-18 16:13 2


17种面试前你需要知道的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数组的方法,希望你能从这个清单列表中学习到新知识,如果你觉得我今天的内容对你有帮助的话,请记得点赞我,关注我,并将它分享给你身边的朋友,也许能够帮助到他。

当然,这个清单列表也只是其中的一部分而已,如果你还有要补充的知识内容,欢迎你在留言区给我留言。

最后,感谢你的阅读,祝编程愉快!

来源: web前端开发

js数组slice()的具体用法介绍

slice(),它能基于当前数组中的一个或多个创建一个新数组。可以接受一或两个参数,即要返回的起始和结束位置。今天wpmee小编就为大家分享js数组slice()的具体用法介绍。

js数组slice()的具体用法介绍 (https://www.wpmee.com/) javascript教程 第1张

一个参数: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()的具体用法介绍 (https://www.wpmee.com/) javascript教程 第2张

以上为大家详解js数组slice()的用法的详细内容,更多请关注WPMEE。

标签:

提交需求或反馈

Demand feedback