JavaScript数组方法中 push() 和 unshift() 的区别

简介: 在给数组push的时候发现一个新的方法unshift() 就找了一下区别:push()push() 方法(在数组结尾处)向数组添加一个新的元素:var webKnowledge = ["HTML", "CSS", "JS", "VUE"];webKnowledge.push("REACT"); // 向 webKnowledge 添加一个新元素 REACT//新数组为:["HTML", "CSS", "JS", "VUE", "REACT"]push() 方法返回新数组的长度:var webKnowledge = ["HTML", "CSS", "JS",

在给数组push的时候发现一个新的方法unshift() 就找了一下区别:

push()

push() 方法(在数组结尾处)向数组添加一个新的元素:

var webKnowledge = ["HTML", "CSS", "JS", "VUE"];
webKnowledge.push("REACT");       //  向 webKnowledge 添加一个新元素 REACT
//新数组为:["HTML", "CSS", "JS", "VUE", "REACT"]

push() 方法返回新数组的长度:

var webKnowledge = ["HTML", "CSS", "JS", "VUE"];
const x = webKnowledge.push("REACT");       //  新数组的长度
//x 的值为 5

unshift() 方法

unshift() 方法(在开头)向数组添加新元素,并“反向位移”旧元素,即将旧元素都左移(注意:这个方法会改变数组中元素的索引):

var webKnowledge = ["HTML", "CSS", "JS", "VUE"];
webKnowledge.unshift("REACT");       //  向 webKnowledge 添加一个新元素 REACT
//新数组为:["REACT", "HTML", "CSS", "JS", "VUE"]

unshift() 方法返回新数组的长度:

var webKnowledge = ["HTML", "CSS", "JS", "VUE"];
const x = webKnowledge.unshift("REACT");       //  新数组的长度
//x 的值为 5

区别

相同点:

  • 都可以向数组中添加元素
  • 都会改变数组的长度
  • 都会返回新的长度
相关文章
|
2月前
|
前端开发 JavaScript 算法
使用 JavaScript 数组方法实现排序与去重
【10月更文挑战第21天】通过灵活运用 `sort()` 方法和 `filter()` 方法,我们可以方便地实现数组的排序和去重。同时,深入理解排序和去重的原理,以及根据实际需求进行适当的优化,能够更好地应对不同的情况。可以通过实际的项目实践来进一步掌握这些技巧,并探索更多的应用可能性。
112 59
|
2月前
|
JavaScript 前端开发
JavaScript 数组方法汇总
【10月更文挑战第21天】这些是 JavaScript 数组中一些常见的方法,它们为我们处理数组提供了强大的工具,使我们能够更加方便快捷地操作数组。你可以根据具体的需求选择合适的方法来实现相应的功能。同时,还可以通过组合使用这些方法来实现更复杂的数组操作。还可以进一步深入研究和探索其他数组方法,以发掘更多的应用场景和潜力。
99 59
|
4月前
|
JavaScript 前端开发 索引
js的循环中foreach、for in和for of的区别
js的循环中foreach、for in和for of的区别
179 0
|
1月前
|
JavaScript 前端开发
js中的bind,call,apply方法的区别以及用法
JavaScript中,`bind`、`call`和`apply`均可改变函数的`this`指向并传递参数。其中,`bind`返回一个新函数,不立即执行;`call`和`apply`则立即执行,且`apply`的参数以数组形式传递。三者在改变`this`指向及传参上功能相似,但在执行时机和参数传递方式上有所区别。
27 1
|
1月前
|
缓存 JavaScript 前端开发
介绍一下 JavaScript 中数组方法的常见优化技巧
通过合理运用这些优化技巧,可以提高 JavaScript 中数组方法的执行效率,提升代码的整体性能。在实际开发中,需要根据具体的业务场景和数据特点选择合适的优化方法。
33 6
|
1月前
|
设计模式 JavaScript 前端开发
js中new和object.creat区别
【10月更文挑战第29天】`new` 关键字和 `Object.create()` 方法在创建对象的方式、原型链继承、属性初始化以及适用场景等方面都存在差异。在实际开发中,需要根据具体的需求和设计模式来选择合适的方法来创建对象。
|
3月前
|
前端开发 JavaScript UED
JavaScript防抖和节流的使用及区别
JavaScript防抖和节流的使用及区别
112 57
|
2月前
|
存储 JavaScript 前端开发
JavaScript 数据类型详解:基本类型与引用类型的区别及其检测方法
JavaScript 数据类型分为基本数据类型和引用数据类型。基本数据类型(如 string、number 等)具有不可变性,按值访问,存储在栈内存中。引用数据类型(如 Object、Array 等)存储在堆内存中,按引用访问,值是可变的。本文深入探讨了这两种数据类型的特性、存储方式、以及检测数据类型的两种常用方法——typeof 和 instanceof,帮助开发者更好地理解 JavaScript 内存模型和类型检测机制。
113 0
JavaScript 数据类型详解:基本类型与引用类型的区别及其检测方法
|
2月前
|
存储 JavaScript 前端开发
js中函数、方法、对象的区别
js中函数、方法、对象的区别
22 2
|
2月前
|
JavaScript 前端开发
【JavaScript】let,const和var的区别
总的来说,随着ECMAScript 6(ES6)及后续版本的推广,`let`和 `const`因其增强的块级作用域和对变量行为的更严格控制,逐渐成为现代JavaScript编码实践中推荐使用的变量声明方式。而 `var`由于其历史遗留的局限性,正逐渐被边缘化,但在维护老代码或处理特定兼容性需求时仍需了解。
43 3