前言

在js中,数组作为一个特殊的对象。是我们常用的数据格式。今天就来梳理一下常用的数组方法.

1.基础

几种基础的就简单介绍一下:
创建数组

var arr1 = new Array();  //括号可以传参,指定数组长度。目前arr1.length是0
var arr2 = new Array(3);//arr2.length是3
var arr3 = new Array(1,2,3,4); //当传多个参数时,js会把这些参数作为数组的初始值。
console.log(arr3); // [1,2,3,4]

new Array()创建数组有一个需要注意的地方。只传一个参数时,如果这个值是非数字。会被当做数组的第一个参数,生成一个长度为1的数组。如果是数字,就会创建一个这个数字长度的空数组。

但其实上面的创建方法不常用。我们更习惯这么写

var arr = [];
var arr = [0,1,2,3]

基础方法

arr.length  //数组的长度
arr[1] //数组下标是1的值。数组的下标从0开始计数
arr.push(值) //往数组添加元素

2.其它方法

var arr = ["element1","element2","element3","element4"];     //下面所有案列都是用的这个数组

//获取指定元素的下标
var index = arr. indexOf(”element2“); // 1

(1)splice(index,number,item1,.....,itemX)从数组中添加/删除元素,然后返回被删除的元素。

参数 描述
index 必需。整数。添加/删除项目的位置,使用负数可从数组结尾处规定位置。
number 必需。要删除的项目数量。如果设置为 0,则不会删除项目。
item1, ..., itemX 可选。向数组添加的新项目。

来看实际例子

//删除
let getReturn = arr.splice(1,1);
console.log(getReturn); // ["element2"]
console.log(arr); //["element1",","element3","element4"] //添加
let getReturn = arr.splice(arr.length,0,"element5","element6");
console.log(getReturn); //[]
console.log(arr); //["element1","element2","element3","element4","element5","element6"]

(2)pop()方法,删除数组最后一位,返回被删除的元素。

let getReturn = arr.pop();
console.log(getReturn); //element4
console.log(arr); //["element1","element2","element3"]

(3)slice(start,end) 从已有的数组中返回选定的元素。

参数 描述
start 必需。整数。添加/删除项目的位置,使用负数可从数组结尾处规定位置。
end 必需。要删除的项目数量。如果设置为 0,则不会删除项目。

注意:请注意,该方法并不会修改数组,而是返回一个子数组。如果想删除数组中的一段元素,应该使用方法 Array.splice()。

let getReturn = arr.slice(1,3);
console.log(getReturn); //["element2", "element3"]
console.log(arr); //["element1", "element2", "element3", "element4"]

(4)join(separator)把数组中的所有元素放入一个字符串。

separator:可选。指定要使用的分隔符。如果省略该参数,则使用逗号作为分隔符。

let getReturn = arr.join();
console.log(getReturn); //element1,element2,element3,element4
console.log(arr); //["element1", "element2", "element3", "element4"]

(5)concat(array1,array2,......,arrayX) 方法用于连接两个或多个数组。

arrayX:必需。该参数可以是具体的值,也可以是数组对象。可以是任意多个。

//传数组
let getReturn = arr.concat(['element5',"element6"],["element7"]);
console.log(getReturn); //["element1", "element2", "element3", "element4", "element5", "element6", "element7"]
console.log(arr); // ["element1", "element2", "element3", "element4"] //传元素
let getReturn = arr.concat('element5',"element6");
console.log(getReturn); //["element1", "element2", "element3", "element4", "element5", "element6"]
console.log(arr); //["element1", "element2", "element3", "element4"]

(6)sort(sortby) 方法用于对数组的元素进行排序。

sortby:可选。规定排序顺序。必须是函数。
返回值:对数组的引用。请注意,数组在原数组上进行排序,不生成新数组。
比较规则:是按照字符编码进行排序,所以可能只有排出来的不是你想要的结果,得传参数解决

let newArr = [3,5,2,4,1];

let getReturn = newArr.sort();
console.log(getReturn); //[1, 2, 3, 4, 5]
console.log(newArr); //[1, 2, 3, 4, 5]

再看一个不如我们所愿的例子

let newArr = [1000,88,93,6,34];
let getReturn = newArr.sort();
console.log(getReturn); //[1000, 34, 6, 88, 93]
console.log(newArr); // [1000, 34, 6, 88, 93] //要实现大小排序,我们需要传参数解决
function sortNumber(a,b){ //定义函数
return a - b
}
let getReturn = newArr.sort();
console.log(getReturn); //[6, 34, 88, 93, 1000]
console.log(newArr); //[6, 34, 88, 93, 1000]

(7)shift() 方法用于把数组的第一个元素从其中删除,并返回第一个元素的值。

如果数组是空的,那么 shift() 方法将不进行任何操作,返回 undefined 值。

  let getReturn = arr.shift();
console.log(getReturn); //element1
console.log(arr); //["element2","element3","element4"]

(8)unshift() 方法可向数组的开头添加一个或更多元素,并返回新的长度。

arr.unshift(newelement1,newelement2,....,newelementX)

  let getReturn = arr.unshift("element-1","element0");
console.log(getReturn); //6
console.log(arr); //["element-1","element0","element1","element2","element3","element4"]

(9)toString() 方法可把数组转换为字符串,并返回结果。

arr.unshift(newelement1,newelement2,....,newelementX)

  let getReturn = arr.toString();
console.log(getReturn,typeof getReturn); //element1,element2,element3,element4 string
console.log(arr,typeof arr); //["element1", "element2", "element3", "element4"] "object"

注:用于字符串操作时,JavaScript 会调用这一方法将数组自动转换成字符串。例如:

let string = arr+"123";
console.log(string); //element1,element2,element3,element4123

(10)reverse() 方法用于颠倒数组中元素的顺序。

该方法会改变原来的数组,而不会创建新的数组。

  let getReturn = arr.reverse();
console.log(getReturn); //["element4", "element3", "element2", "element1"]
console.log(arr); //["element4", "element3", "element2", "element1"]

3.还有

此外,还有valueOf(),toLocaleString(),toSource()方法。但是从来没用过,也没想到什么使用场景,就不单独讲了。

原文地址:https://segmentfault.com/a/1190000016948796

js:Array对象常用方法介绍的更多相关文章

  1. js array 对象

    Javascript 对象: Array 对象:数组 创建方法: 1, var a = new Array() 2,var a = new Array(3) 3,var a = new Array(“ ...

  2. JS中部分 Array 对象方法介绍

    1.concat() concat() 方法用于连接两个或多个数组.该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本 <script type="text/javascrip ...

  3. js Array对象

    http://www.w3cschool.cc/js/js-obj-array.html 创建新方法 原型是JavaScript全局构造函数.它可以构建新Javascript对象的属性和方法. 实例: ...

  4. 88.NODE.JS加密模块CRYPTO常用方法介绍

    转自:https://www.jb51.net/article/50668.htm 使用require('crypto')调用加密模块. 加密模块需要底层系统提供OpenSSL的支持.它提供了一种安全 ...

  5. js数组对象常用方法小结

    ~~~数组添加元素后一般返回数组的新长度 如: push(ele1[,ele2...]), unshift(ele1[,ele2...]) ~~~数组删除元素后一般返回被删除的元素 如: pop() ...

  6. JavaScript Array 对象常用方法

    <script type="text/javascript"> //shift:删除原数组的第一项,返回删除元素的值:如果数组为空则返回undefined var ar ...

  7. Array对象常用方法

    不改变原数组: 1.concat()  连接两个或多个数组 不改变原数组 返回被连接数组的一个副本 2.join()  把数组中所有元素放入一个字符串 不改变原数组 返回字符串 3.slice()   ...

  8. Math对象常用方法介绍

     <script>         /* 001-Math.abs()  绝对值 */         console.log(Math.abs(123), Math.abs(-998), ...

  9. Javascript中String、Array常用方法介绍

    string和array作为javascript内置对象,其中许多方法无论是在开发过程中,还是在面试的时候都有机会被面试官问到,这里对经常用到的方法做一个介绍,这些方法都有过很多的实际应用场景,所以对 ...

随机推荐

  1. CefSharp 设置cookie

    设置cookie var cookieManager = CefSharp.Cef.GetGlobalCookieManager(); await cookieManager.SetCookieAsy ...

  2. 【cl】maven新建项目

    http://blog.csdn.net/sushengmiyan/article/details/40142771 使用maven创建一个helloworld 在本地硬盘创建一个文件夹作为maven ...

  3. HTTP详解工作原理

    1. HTTP简介 HTTP协议(HyperText Transfer Protocol,超文本传输协议)是用于从WWW服务器传输超文本到本地浏览器的传送协议.它可以使浏览器更加高效,使网络传输减少. ...

  4. Adding Search

    https://docs.asp.net/en/latest/tutorials/first-mvc-app/search.html In this section you’ll add search ...

  5. [HTML] 微信wap开发---页面自适应大小

    <meta name="viewport" content="width=device-width, initial-scale=0.5, minimum-scal ...

  6. java中 抽象类和抽象方法

    在面向对象中,所有的对象都是由类来描绘的,但是并不是所有的类都用来描绘对象的,当一个类并不能包含完整的信息来描绘一个具体的对象时,我们把这个类称为抽象类.抽象类除了不完整的描述一个对象之外,其他的功能 ...

  7. guice基本使用,配置模块的两种方式(三)

    guice是使用module进行绑定的,它提供了两种方式进行操作. 第一种是继承AbstractModule抽象类. package com.ming.user.test; import com.go ...

  8. elasticsear+kibana+logstash 优化

    ##关于s2安装cerebro来可视化集群管理##### https://blog.csdn.net/RWSLR6/article/details/79648767 https://github.co ...

  9. SQLServer Union 和 Union All 在Insert 语句中的不同效果

    如果不是发了那个帖子还不会像这样意外发现这两者的不同,好歹了也工作了一段时间,真是汗颜 上例子: 执行此条插入语句后,只会插入两条数据,因为会把完全重复的数据过滤掉 insert into tests ...

  10. 洛谷P2607 [ZJOI2008]骑士(树形dp)

    题目描述 Z国的骑士团是一个很有势力的组织,帮会中汇聚了来自各地的精英.他们劫富济贫,惩恶扬善,受到社会各界的赞扬. 最近发生了一件可怕的事情,邪恶的Y国发动了一场针对Z国的侵略战争.战火绵延五百里, ...