JavaScript给数组添加元素的6个方法
目录
- 1. 使用 length 属性追加元素
- 2. 使用 push 方法追加元素
- 3. 使用 unshift 方法在数组的第一项前插入一个元素
- 4. 使用 splice 方法插入一个元素
- 5. 使用 concat 方法合并元素
- 6. 使用 … 扩展运算符合并元素
1. 使用 length 属性追加元素
使用length属性,可以在数组末尾后面添加一个元素
var arr = [1, 2, 3, 4, 5]; arr[length] = 6; console.log(arr); // [1, 2, 3, 4, 5, 6];
2. 使用 push 方法追加元素
push()方法将一个或多个元素添加到数组的末尾,并返回该数组的新长度
var arr = [1, 2, 3, 4, 5]; arr.push(6); console.log(arr); // [1, 2, 3, 4, 5, 6];
3. 使用 unshift 方法在数组的第一项前插入一个元素
unshift()方法将一个或多个元素添加到数组的开头,并返回该数组的新长度
var arr = [1, 2, 3, 4, 5]; arr.unshift (6); console.log(arr); // [6, 1, 2, 3, 4, 5];
4. 使用 splice 方法插入一个元素
splice()方法通过删除或替换现有元素或者原地添加新的元素来修改数组,并以数组形式返回被修改的内容
var arr = [1, 2, 3, 4, 5]; arr.splice(5, 0, 6); console.log(arr); // [1, 2, 3, 4, 5, 6];
5. 使用 concat 方法合并元素
concat()方法用于将一个数组或值合并至一个数组中,该方法不会改变原数组
var arr = [1, 2, 3, 4, 5]; var newArr = arr.concat(6); console.log(newArr); // [1, 2, 3, 4, 5, 6];
6. 使用 … 扩展运算符合并元素
展开语法...: 可以在数组构造时, 将数组表达式在语法层面展开
var arr = [1, 2, 3, 4, 5]; arr = [...arr, 6]; console.log(arr); // [1, 2, 3, 4, 5, 6];
到此这篇关于JavaScript给数组添加元素的6个方法的文章就介绍到这了,更多相关JavaScript 数组添加元素内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!
相关推荐
-
JavaScript使用push方法添加一个元素到数组末尾用法实例
本文实例讲述了JavaScript使用push方法添加一个元素到数组末尾的用法.分享给大家供大家参考.具体如下: 下面的代码演示了JS数组通过push方法添加一个元素到数组末尾 <!DOCTYPE html> <html> <body> <p id="demo"> Click the button to add a new element to the array. </p> <button onclick="
-
js实现以最简单的方式将数组元素添加到对象中的方法
如下所示: //如题,通常做法就是循环数组,最后在添加length属性,如: var obj = {}; var pushArr = [11,22,33,44,55,66]; for(var i=0;i<pushArr.length;i++) { obj[i] = pushArr[i]; } obj.length = pushArr.length; console.log(obj); //{0:11,1:22,2:33,3:44,4:55,5:66,length:6} 简单方法: //js将数组
-
如何给JS中的数组开头添加元素
目录 JS数组开头添加元素 1.使用Array.unshift()方法 2.使用扩展运算符(…) 3.使用Aarry.concat()方法 向数组的开头添加一个或更多元素 JS数组开头添加元素 1.使用Array.unshift()方法 //向数组开头添加一个或多个元素,并返回新的长度,该方法改变原数组 let person= ['张三', '李四', '王五']; console.log(person.unshift('小明')); // 4 console.log(person); // [
-
解析javascript 数组以及json元素的添加删除
javasscript删除数组的3种方法1,用shift()方法shift:删除原数组第一项,并返回删除元素的值:如果数组为空则返回undefinedvar chaomao=[1,2,3,4,5]var chaomao.shift()//得到1alert(chaomao)//[2,3,4,5] 2,用pop()方法pop:删除原数组最后一项,并返回删除元素的值:如果数组为空则返回undefinedvar chaomao=[1,2,3,4,5]var chaomao.pop()//得到5alert
-
JS在Array数组中按指定位置删除或添加元素对象方法示例
JavaScript的数据中可通过splice/slice在指定位置添加或删除元素.另外还有slice.delete等方法实现. splice简介 splice方法向/从数组中添加/删除项目,然后返回被删除的项目. 该方法会改变原始数组. arrayObject.splice(index, howmany, item1, ..., itemX) 参数 描述 index 必需.整数,规定添加/删除项目的位置,使用负数可从数组结尾处规定位置. howmany 必需.要删除的项目数量.如果设置为 0,
-
向JavaScript的数组中添加元素的方法小结
在数组的开头添加新元素 - unshift() 源代码: <!DOCTYPE html> <html> <body> <p id="demo">Click the button to add elements to the array.</p> <button onclick="myFunction()">Try it</button> <script> function
-
JS数组array元素的添加和删除方法代码实例
js数组元素的添加和删除一直比较迷惑,今天终于找到详细说明的资料了,先给个我测试的代码^-^ var arr = new Array(); arr[0] = "aaa"; arr[1] = "bbb"; arr[2] = "ccc"; //alert(arr.length);//3 arr.pop(); //alert(arr.length);//2 //alert(arr[arr.length-1]);//bbb arr.pop(); //al
-
JavaScript给数组添加元素的6个方法
目录 1. 使用 length 属性追加元素 2. 使用 push 方法追加元素 3. 使用 unshift 方法在数组的第一项前插入一个元素 4. 使用 splice 方法插入一个元素 5. 使用 concat 方法合并元素 6. 使用 … 扩展运算符合并元素 1. 使用 length 属性追加元素 使用length属性,可以在数组末尾后面添加一个元素 var arr = [1, 2, 3, 4, 5]; arr[length] = 6; console.log(arr); // [1, 2,
-
JavaScript清空数组元素的两种方法简单比较
本文实例讲述了JavaScript清空数组元素的两种方法简单比较.分享给大家供大家参考.具体分析如下: JavaScript中数组清空有多种方法: var arr = [1, 2, 3]; arr = [];//方法一 arr.length = 0;//方法二 arr = null;//方法三 delete arr;//方法四 这里比较最常用的第一种和第二种 var arr = [1, 2, 3]; // 方法一 // 优点:如果有其他地方用到了数组arr中的元素,这种方法相对来说更安全.并且也
-
javascript过滤数组重复元素的实现方法
javascript过滤数组重复元素的实现方法 以下是在网上找的资料,直接在项目中可以使用,大家可以参考下: 实现代码: function filterArray(receiveArray){ var arrResult = new Array(); //定义一个返回结果数组. for (var i=0; i<receiveArray.length; ++i) { if(check(arrResult,receiveArray[i]) == -1) { //在这里做i元素与所有判断相同与否 ar
-
JavaScript获取数组最小值和最大值的方法
本文实例讲述了JavaScript获取数组最小值和最大值的方法.分享给大家供大家参考.具体如下: var arr = new Array(); arr[0] = 100; arr[1] = 0; arr[2] = 50; var min = Math.min.apply(null, arr), max = Math.max.apply(null, arr); 以下是补充: var a=[1,2,3,5]; alert(Math.max.apply(null, a));//最大值 alert(Ma
-
JavaScript把数组作为堆栈使用的方法
本文实例讲述了JavaScript把数组作为堆栈使用的方法.分享给大家供大家参考.具体如下: JavaScript把数组作为堆栈使用的代码范例,支持堆栈常用的push和pop方法 <script type="text/javascript"> var numbers = ["one", "two", "three", "four"]; numbers.push("five")
-
javascript判断数组内是否重复的方法
本文实例讲述了javascript判断数组内是否重复的方法.分享给大家供大家参考.具体如下: Array.prototype.del = function(){ var a = {}, c = [], l = this.length; for (var i = 0; i < l; i++) { var b = this[i]; var d = (typeof b) + b; if (a[d] === undefined) { c.push(b); a[d] = 1; } } return c;
-
JavaScript对数组进行随机重排的方法
本文实例讲述了JavaScript对数组进行随机重排的方法.分享给大家供大家参考.具体如下: 这里提供了两个方法对数组进行随机重排. <script> var count = 100000,arr = []; for(var i=0;i<count;i++){ arr.push(i); } //常规方法,sort() var t = new Date().getTime(); Array.prototype.sort.call(arr,function(a,b){ return Math
-
JavaScript去除数组里重复值的方法
本文实例讲述了JavaScript去除数组里重复值的方法.分享给大家供大家参考.具体如下: var unique = function(origArr) { var newArr = [], origLen = origArr.length, found, x, y; for ( x = 0; x < origLen; x++ ) { found = undefined; for ( y = 0; y < newArr.length; y++ ) { if ( origArr[x] === n
-
JavaScript中数组去重的5种方法
正常情况下,数据去重的工作一般都是由后端同事来完成的,但是前端也要掌握好处理数据的能力,万一去重的工作交给我们大前端处理,我们也不能怂呀.现在我总结了一些去重的方法,希望对大家有点帮助. 方法一:new Set()实现数组去重 ES6 提供了新的数据结构 Set,它类似于数组,但是成员的值都是唯一的,没有重复的值. Set 本身是一个构造函数,用来生成 Set 数据结构.Set函数可以接受一个数组,用于初始化.根据 Set的数据特性,我们可以实现数组去重. let list = [1, 1, '
-
JavaScript实现数组去重的7种方法
目录 前言 方法实现 双循环去重 indexOf方法去重1 indexOf方法去重2 相邻元素去重 利用对象属性去重 set与解构赋值去重 Array.from与set去重 总结 前言 去重是开发中经常会碰到的一个热点问题,不过目前项目中碰到的情况都是后台接口使用SQL去重,简单高效,基本不会让前端处理去重. 那么前端处理去重会出现什么情况呢?假如每页显示10条不同的数据,如果数据重复比较严重,那么要显示10条数据,可能需要发送多个http请求才能够筛选出10条不同的数据,而如果在后台就去重了的
随机推荐
- asp.net SqlDataReader绑定Repeater
- jQuery的one()方法用法实例
- php数组函数序列之array_combine() - 数组合并函数使用说明
- Python判断变量是否已经定义的方法
- Spring 事务隔离与事务传播的详解与对比
- 浅析使用BootStrap TreeView插件实现灵活配置快递模板
- android获取相册图片和路径的实现方法
- js关于精确计算和数值格式化以及直接引js文件
- jQuery EasyUI中对表格进行编辑的实现代码
- PHP 上传文件的方法(类)
- 创建高性能的 Web 页面
- C# WinForm中禁止改变窗口大小的方法
- ScrollView滚动条颜色的设置方法
- Android运用onTouchEvent自定义滑动布局
- vue-router启用history模式下的开发及非根目录部署方法
- JS实现换肤功能的方法实例详解
- 浅谈springboot的三种启动方式
- JavaScript设计模式之原型模式分析【ES5与ES6】
- iOS实现头部拉伸效果
- CodeIgniter框架钩子机制实现方法【hooks类】