1.length 数组长度

计算数组的长度

var arr=[1,2,3,4,5];
console.log(arr.length);//输出结果是5

2. push() 添加元素

向数组尾部添加新元素,返回值是数组的新长度

var arr=[1,2,3,4,5];
console.log(arr.push(6,7));//输出结果是7
console.log(arr);//输出结果是[1,2,3,4,5,6,7]

3. pop() 删除元素

删除并返回最后一个元素

var arr = [1, 2, 3, 4, 5];
console.log(arr.pop());//输出结果是5
console.log(arr);//输出结果是[1,2,3,4]

4. reserve() 颠倒顺序

将数组元素颠倒顺序,数组本身发生了变化

var arr = [1, 2, 3, 4, 5];
console.log(arr.reverse());//输出结果是[5,4,3,2,1]
console.log(arr);//输出结果是[5,4,3,2,1]

5. join() 数组转为字符串

把数组转为字符串。即把数组所有元素通过指定的分隔符变革一个字符串,数组本身不发生变化。

var arr = [1, 2, 3, 4, 5];
console.log(arr.join(','));//输出结果是1,2,3,4,5
console.log(arr);//输出结果是[1, 2, 3, 4, 5]

6. map() 操作元素

将数组中的每个元素调用一个提供的函数,结果作为一个新的数组返回,并没有改变原来的数组。=>是es6的箭头函数,在后面会介绍。

对数组进行遍历

var arr = [1, 2, 3, 4, 5];
arr.map(item => {
console.log(item)
})

对数组内容进行操作后返回新数组

var arr = [1, 2, 3, 4, 5];
console.log(arr.map(item => item*2)) //输出结果是[2, 4, 6, 8, 10]
console.log(arr) //输出结果是[1, 2, 3, 4, 5]

7. forEach() 遍历元素

将数组中的每个元素执行提供的函数,没有返回值,并没有改变原来的数组,常用来遍历数组。

var arr = [1, 2, 3, 4, 5];
arr.forEach(item => {
console.log(item)
})

8. filter() 元素过滤

将所有元素进行判断,将满足条件的元素作为一个新数组返回,不会改变原始数组。

实例1:过滤所有的奇数

var arr = [1, 2, 3, 4, 5];
//过滤出奇数
console.log(arr.filter(item => {
return item%2==1
})) //输出结果是[1, 3, 5]
console.log(arr)//输出结果是 [1, 2, 3, 4, 5]

实例2:判断数组中是否包含某个值。当包含时会返回此值的数组,不存在时返回空数组

var arr = [1,5,4,3]
console.log(arr.filter(item => item==3))//[3]

实例3:过滤掉null,undefined,空字符串

var arr2 = [1, null, 2, '', 'm', undefined, 222]
console.log(arr2.filter(item => item))//[ 1, 2, 'm', 222 ]

实例4:数组去重。index表示索引,self表示filter函数本身。

var arr = [1, 2, 2, 3, 4, 5, 5, 6, 7, 7, 8, 8, 0, 8, 6, 3, 4, 56, 2];
var arr2 = arr.filter((item, index, self) => self.indexOf(item) === index)
console.log(arr2); //[1, 2, 3, 4, 5, 6, 7, 8, 0, 56]

9. every() 元素判断

将所有元素进行判断,如果所有元素都满足判断条件,则返回true,否则为false。常作为所有条件判断。

var arr = [1, 2, 3, 4, 5];
var morethan4 = value => value > 4
var lessthan6 = value => value < 6
console.log("arr数组所有元素都大于4吗?" + arr.every(morethan4))//输出结果是 arr数组所有元素都大于4吗?false
console.log("arr数组所有元素都小于6吗?" + arr.every(lessthan6))//输出结果是 arr数组所有元素都小于6吗?true

10. some() 元素判断

将所有元素进行判断,如果存在元素满足判断条件,则返回true,若所有元素都不满足判断条件,则返回false。常作为部分条件判断。

var arr = [1, 2, 3, 4, 5];
var morethan4 = value => value > 4
var morethan6 = value => value > 6
console.log("arr数组存在元素大于4吗?" + arr.some(morethan4))//输出结果是arr数组存在元素大于4吗?true
console.log("arr数组存在元素大于6吗?" + arr.some(morethan6))//输出结果是arr数组存在元素大于6吗?false

11. reduce() 操作内容

所有元素都调用返回函数,返回值为最后结果,传入的值必须是函数类型。

var arr = [1, 2, 3, 4, 5];
//遍历元素,将它们累加后返回
console.log(arr.reduce((a,b) => {
return a+b
}))//输出结果是15

12. shift() 删除元素

删除数组中的第一个元素并返回。

var arr = [1, 2, 3, 4, 5];
console.log(arr.shift())//输出结果是 1
console.log(arr)//输出结果是[2, 3, 4, 5]

13. unshift() 添加元素

将一个或多个元素添加到数组的开头,并返回数组的长度。

var arr = [1, 2, 3, 4, 5];
console.log(arr.unshift(6,7))//输出结果是7
console.log(arr)//输出结果是[1, 2, 3, 4, 5, 6, 7]

14. concat() 连接数组

将多个数组进行拼接,返回一个新数组。

var arr = [1, 2, 3, 4, 5]
var arr2=[6, 7]
console.log(arr.concat(arr2))//输出结果是[1, 2, 3, 4, 5, 6, 7]

15. toString() 数组转字符串

将数组转为字符串。

var arr = [1, 2, 3, 4, 5]
console.log(arr.toString())//输出结果是1, 2, 3, 4, 5

16. splice(开始位置, 删除的个数,元素)

万能的方法,可实现数组的增删改。常用于删除指定元素。

新增元素时,删除个数为0:

var arr = [1, 2, 3, 4, 5]
arr.splice(1,0,6)//在索引为1的位置插入元素
console.log(arr)//输出结果是[1, 6, 2, 3, 4, 5]

删除元素时,元素不写:

var arr = [1, 2, 3, 4, 5]
arr.splice(1,1)//删除索引为1的元素
console.log(arr)//输出结果是[ 1, 3, 4, 5]

修改元素时,删除个数为1:

var arr = [1, 2, 3, 4, 5]
arr.splice(1,1,6)//把索引为1的元素替换为6
console.log(arr)//输出结果是[ 1,6, 3, 4, 5]

17. Array.isArray() 判断是否数组

判断是否是一个数组

var arr = [1, 2, 3, 4, 5]
//判断是否是一个数组
console.log(Array.isArray(arr))//输出结果是true
console.log(Array.isArray({'id':1}))//输出结果是false

18. sort() 数组排序

对数组的内容进行排序,可以数字,字符串数字,字母等,会按照Unicode进行升序排序。数组内容已经变成排序后的结果!

console.log([5,6,9,1,2,4].sort())//[1, 2, 4, 5, 6, 9]
console.log(['5','6','9','1','2','4'].sort())//["1", "2", "4", "5", "6", "9"]
console.log(['b','f','a','A','C','4'].sort())//["4", "A", "C", "a", "b", "f"]

下面看一个特例

console.log([5,1,10,20,2].sort())//[1, 10, 2, 20, 5]

结果出乎意料,10竟然在2前面,原因就是它是根据Unicode来排序。对于数字的这种情况,需要些一个方法,然后给sort调用:

function compare(m,n){
if (m < n) return -1
else if (m > n) return 1
else return 0
}
const arr = [5,1,10,20,2]
console.log(arr.sort(compare))//[ 1, 2, 5, 10, 20 ]

通过这种方式,自定义比较方式,就可以完美的解决这个问题。对于字符串数字也是类似。

JS数组的常用属性或方法的更多相关文章

  1. Node.js process 模块常用属性和方法

    Node.js是常用的Javascript运行环境,本文和大家发分享的主要是Node.js中process 模块的常用属性和方法,希望通过本文的分享,对大家学习Node.js http://www.m ...

  2. js dom 的常用属性和方法

    1.对象集合:      (1).all[];      (2).images[];      (3).anchors[];      (4).forms[];      (5).links[];   ...

  3. js数组定义、属性及方法(push/pop/unshfit/shfit/reverse/sort/slice/splice/indexOf/lastIndexOf)

    数组 一.定义数组 * 字面量方式  var 数组名称 = [ value,value,... ] * 构造函数方式 var 数组名称 = new Array(value,value,...):  v ...

  4. UITableView常用属性和方法 - 永不退缩的小白菜

    UITableView常用属性和方法 - 永不退缩的小白菜 时间 2014-05-27 01:21:00  博客园精华区原文  http://www.cnblogs.com/zhaofucheng11 ...

  5. UIView的一些常用属性和方法

    UIView的一些常用属性和方法 1. UIView的属性 UIView继承自UIResponder,拥有touches方法. - (instancetype)initWithFrame:(CGRec ...

  6. SVG DOM常用属性和方法介绍(1)

    12.2  SVG DOM常用属性和方法介绍 将以Adobe SVG Viewer提供的属性和方法为准,因为不同解析器对JavaScript以及相关的属性和方法支持的程度不同,有些方法和属性是某个解析 ...

  7. 第190天:js---String常用属性和方法(最全)

    String常用属性和方法 一.string对象构造函数 /*string对象构造函数*/ console.log('字符串即对象');//字符串即对象 //传统方式 - 背后会自动将其转换成对象 / ...

  8. UIView常用属性与方法/UIKit继承结构

    UIView常用属性与方法 @interface UIView : UIResponder<NSCoding, UIAppearance, UIAppearanceContainer, UIDy ...

  9. ios基础篇(四)——UILabel的常用属性及方法

    UILabel的常用属性及方法:1.text //设置和读取文本内容,默认为nil label.text = @”文本信息”; //设置内容 NSLog(@”%@”, label.text); //读 ...

随机推荐

  1. 翻译:《实用的Python编程》00_Setup

    课程设置与概述 欢迎访问本课程(Practical Python Programming).这个页面包含一些关于课程设置的重要信息. 课程周期和时间要求 该课程最初是作为一个由讲师主导的,持续 3 - ...

  2. A - The Suspects (sars传染)

    题意:有m组,0为起点,有0的那一组全是嫌疑人,之后会不断传递到其它组去,问一共有多少人是嫌疑人. Severe acute respiratory syndrome (SARS), an atypi ...

  3. 2018 ACM-ICPC 焦作区域赛 E Resistors in Parallel

    Resistors in Parallel Gym - 102028E 吐槽一下,网上搜索的题解一上来都是找规律,对于我这种对数论不敏感的人来说,看这种题解太难受了,找规律不失为一种好做法,但是题解仅 ...

  4. pbds初探

    今年暑假外校集训的时候一道题标算是最短路扩展,然而std用的是pbds,于是就产生了研究的兴趣.结果那个标程我现在死都找不到了233 定义: 在知乎上看到有oier去年向CCF发了邮件,得到的回复是p ...

  5. [HDU-5172] 单点查询线段树

    题意: 给你一个长度为n的数组v[],有m次询问,问你在区间[L,R]中是否包含区间[1,R-L+1]的全部数字,如果是输出YES,否则输出NO 题解: 区间[1,R-L+1]与区间[L,R]的长度一 ...

  6. HDU - 1059 背包dp

    题目: 有两个小朋友想要平分一大堆糖果,但他们不知道如何平分需要你的帮助,由于没有spj我们只需回答能否平分即可. 糖果大小有6种分别是1.2.3.4.5.6,每种若干颗,现在需要知道能不能将这些糖果 ...

  7. ES中文分词器安装以及自定义配置

    之前我们创建索引,查询数据,都是使用的默认的分词器,分词效果不太理想,会把text的字段分成一个一个汉字,然后搜索的时候也会把搜索的句子进行分词,所以这里就需要更加智能的分词器IK分词器了. ik分词 ...

  8. 流媒体传输协议之 RTP(下篇)

    本系列文章将整理各个流媒体传输协议,包括 RTP/RTCP,RTMP,希望通过深入梳理协议的设计细节,能够给流媒体领域的开发者带来一定的启发. 作者:逸殊 审核:泰一 接上篇:< 流媒体传输协议 ...

  9. LOJ6283 数列分块入门 7 (分块 区间加/乘)题解

    题意:区间加,区间乘,单点询问 思路:假设一个点为a,那么他可以表示为m * a + sum,所以区间加就变为m * a + sum + sum2,区间乘变为m * m2 * a + sum * m2 ...

  10. 力扣566. 重塑矩阵-C语言实现-简单题

    题目 传送门 在MATLAB中,有一个非常有用的函数 reshape,它可以将一个矩阵重塑为另一个大小不同的新矩阵,但保留其原始数据. 给出一个由二维数组表示的矩阵,以及两个正整数r和c,分别表示想要 ...