JavaScript 数组对象总结

数组的定义格式

1、var 数组名称 = new Array ();

var arr = new Array(); //空数组

var arr = new Array(1,2,3,4,5);

var arr = new Array(3);//表示数组包含3个元素,但是现在元素中还没有值,3个undefined;

var arr = new Array('a');/

表示数组中有一个元素'a' ;

2、var 数组名称 = [值1,值2,值3...];

var arr = [];//空数组

var arr = [1,2,3,4,5];

var arr = [3];// 表示数组中只有一个数组元素,就是3;

console.log(typeof arr); // object

3、数组元素的操作:增、删、改、查

增:为数组增加新的元素,js里面数组的长度是可变的;

方式一:arr[下标] = '新值';

方式二:arr.length = 新的长度:注意,新的长度比原有的值大;

删:删除数组中的某个数据,格式:delete 数组名称[索引号];空间还在,值被删了,索引这个被删的元素返回:undefined;

改:更改数组中元素的值,格式:数组名称[索引号] = '新值'

查:获取元素,格式: 数组名称[索引号/下标]

4、数组的遍历

var arr = [1,2,3,4,5];

方式1:利用 for 循环:

for (var i = 0;i <arr.length; i++){

    console.log(i);

}

方式2:利用 for in 循环:主要用来遍历数组的下标,或对象的属性;

for (var i in 数组名称){ //i 表示下标

    console.log(i); //获取下标

    console.log(arr[i]); //获取数组元素

}

方式3: for of 循环:遍历的是数组的值,没有下标

for (var ele of 数组名称){

    console.log(ele); // ele 是数组的值

}

方式4 :for each 方法:该方法是数组对象的方法,可以用来遍历数组的值和下标

forEach(function(ele,index){//ele表示数组的值,index表示数组的下标

    操作;

})

例:

    arr.forEach(function(ele,index){

        console.log(ele+index);//ele返回的是值,index返回的是下标

    })

5、数组对象的方法:

(1)join 方法

作用:将数组转为字符串

格式:数组.join('分隔符');

分隔符:

1、可以省略,转换时数组用逗号进行分隔;

2、可以指定分隔符,如数组,join('-');

3、如果不要分隔符,那么可以在小括号中设置空字符串作为参数;

var arr = [a,b,c,d];

var str = arr.join(); //默认用逗号作为分隔符;

var str = arr.join('-'); //分隔符换 '-';

var str = arr.join(''); //将数组元素拼接在一起,没有分隔符;

console.log(str);

(2)indexof 方法

1、作用:在数组中查找指定的值,如果有则返回其下标,如果没有则返回 -1;

2、注意: indexof 在操作时,是从前向后查找,如果找到则停止查找;

3、格式:数组名称.indexof(要查找的值,查找的起始位置);如果省略起始位置,则表示从头开始查找;

var arr = [10,20,30,40];

var res = arr.indexof(40);

console.log(res); //3  返回下标的值,找第一个

var res1 = arr.indexof(40,4);//从第4个开始查找

(3) lastindexof 方法

作用、格式、注意:同上;

不同点:lastindexof 是从后向前查找;

(4) length属性

作用:获取或设置数组长度;

获取格式:数组名称.length;

设置格式:数组名称.length = 新的长度;

注意:length 小于原有长度,则表示从前向后对数组进行截取;大于原有长度,则表示将数组长度进行拓展。

(5)map()方法:

作用:返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值,不会对空数组进行检测;修改、重组的数据,原来的数组没变化

格式:数组.map(function(currentvalue,index,arr){

});

参数说明:

currentvalue :正在处理的数组元素,当前元素;

index :当前元素的下标;

arr :当前元素所在的数组  ;

var arr = [1,2,3,4,5,6,7,8,9,10];

arr.map(function(val,index,arr){

    console.log(val);//数组元素

    console.log(index); //数组下标

    console.log(arr); //表示数组

})

(6) find()方法

作用:find() 方法返回通过测试(函数内判断) 的数组的第一个元素的值;

格式: 数组名称.find(function(val ,  index , arr){

return val > 50;

});

(7)findIndex()方法

作用:返回通过测试 (函数内判断) 的数组的第一个元素的下标;

格式:数组名称.findIndex(function(val, index, arr))

(8) some方法

作用:some() 方法用于检测数组中的元素是否满足指定条件(函数提供),有满足条件的返回 true,否则返回 false

格式:数组名称.some(function(val , index , arr))

(9) every()方法

作用:every() 方法用于检测数组中所有元素是否都符合指定条件(通过函数提供)。

格式:数组名称.every(function(currentvalue, index, arr))

(10) includes()方法

作用: includes()方法判断一个数组是否包含一个指定的值,如果是返回 true,否则 false。

格式:数组.includes(searchelement, fromIndex);

(11) sort()方法

作用:对数组中的元素进行排序

格式:数组.sort(参数);

如果数组元素都是数值型的数据,那 sort 在不传参时,排序的结果有问题:因为在使用 sort方法对数值型数据进行排序时,会先将里边的元素转换为字符型,然后按照字符型的比较规则进行比较

//解决方法:给 sort方法传递参数 (a,b)

(a - b)  ==== 升序

(b - a ) ==== 降序

var arr = [1,3,5,2,7];

arr.sort(); //如果不传参,那么数值型数据在排序时会错误

(12) splice方法 :可以对数组进行 增 、删 、改操作;

增的格式: 数组名称.splice(下标,0 ,要增加的数据);

删的格式:数组名称.splice(下标,个数);返回值为被删除元素形成的新的数组;

改的格式:数组名称.splice(下标,个数,新的值)

(13) reduce()方法 和 reduceright() 方法

作用: reduce()方法接收一个函数作为累加器,数组中的每个值(从左到右) 开始缩减,最终计算为一个值。 reduceRight()的作用和 reduce 相同,但是执行时是从右到左

格式:数组.reduce(function(prev, currentvalue, currentindex, arr){} ,初始值);

注意:如果设置初始值,那么在第一次调用回调函数时,prev 的值为这个初始值,如果不设置初始值,那么默认情况下, prev 的值为数组的第一个元素。

prev :数组的第一元素

currentvalue:第二元素

currentindex:第二元素的下标

arr: 整个数组

(14) concat () 方法

作用:数组拼接;

格式:数组名称1.concat(数组名称2,数据);

6、数组的分类

1、从下标的个数分:一维数组、二维数组、多维数组

1)一维数组:下标为一个的数组,如 arr[下标]

var 数组名称 = [值1,值2,值3...]

2)二维数组:下标为两个的数组,如 arr[下标]  [下标]

var 数组名称 = [[值1,值2,值3...][值4,值5,值6]...]

var arr = [

    [1,2,3],

    [4,5,6],

    [7,8,9]

];

console.log(arr);

注意:里面的小数组的长度可以相同,也可以不同;

二维数组元素的操作:

    1、增:数组名称[下标1][下标2] = 值;

    2、删:delete 数组名称[下标1][下标2];

    3、改:数组名称[下标1][下标2] = 新值;

    4、查:数组名称[下标1][下标2]

二维数组的遍历:使用循环嵌套

for (var i = 0;i < arr.length; i++){

    for (var j = 0; j < arr.length; j ++){

        console.log(arr[i][j]);

    }

}

3)多维数组:下标的个数大于等于 3 个

2、从下标的类型分:索引型数组、关联型数组

1)索引型数组:数组元素的下标为数值型 ,如 arr[0]

2)关联式数组:数组元素的下标为字符,如 arr['name']

对象:

一、概述:在 JavaScript 中所有的事物都是对象:字符串、布尔、数值、数组、函数等;

类:具有相同属性和方法的集合。

1、内置对象(本地对象):Math() 对象,number()对象,Date() 对象等...

2、宿主对象:Dom(文档对象模型),Bom(浏览器对象)。

3、自定义对象:我们自己定义和开发的对象。

二、对象的创建

(1) 字面量形式创建对象,格式:

var 对象名称 = {

属性名:属性值,

属性名:属性值,

...

属性名:function(){}

};

对象创建时的注意事项:

1、属性名也被称为键,属性值被称为值,属性名和属性值被称为键值对;

2、键和值之间用冒号分隔,键值对与键值对之间用逗号分隔,最后一条键值对后面不要加逗号;

3、键不是标识符,就是一个普通的字符,所以可以不用遵守标识符的命名规则,但是建议还是遵守标识符的命名规则。

4、值的类型可以是任意类型,可以是基本类型的数据,也可以是引用类型的数据。

对象内容的增、删、改、查

增:为对象添加新的属性和功能

1、 对象.属性名称 = 值

2、中括号:对象['属性名称'] = 值

删:删除对象中的某个属性

1、delete 对象名称.属性名称

2、delete 对象名称['属性名']

3、如果删除成功,则返回true ,否则返回false

改:修改某个属性的值;

1、对象名称.属性名称 = 新的值;

2、对象名称.['属性名称'] = 新的值;

查:获取对象中某个属性的值,或者调用对象中某个方法

1、点语法:对象名称.属性名称、 对象名称.方法名称();

2、空括号的方式:对象名称['属性名称']、对象名称['方法名称'](   

)

3、区别:点语法后面不可以加变量,中括号后面可以加变量

注意:如果对象的键包含特殊符号,不可以采用点语法的方式,只能采用中括号的方式

对象属性的遍历: for in 专门用来遍历对象属性的循环

利用 object.keys 方法获取的所有属性,格式: object.keys(对象名称); 返回的结果是数组形式;

var obj = {

    a:1,

    b:2,

    c:3,

    d:4

};

var vals = object.value(obj);

利用 object.entries 方法获取对象中所有的属性名和属性值,格式:object.entries(对象名称);返回结果为二维数组

var obj = {

    a:1,

    b:2,

    c:3,

    d:4

};

var res = object.entries(obj);

keys():返回数组的下标

values():返回数组元素的值

entries():返回数组元素的键名和键值

(2) 对象创建的其他方式,利用 object 构造方法创建对象,格式: var 对象名称 = new Object();

(3)利用 object.create(null);方法创建对象//很少使用

var obj = Object.create(null);

in 关键字

作用: 判断某个属性是否属性对象,如果属于这个对象,则返回true,否则返回 false;

格式:'属性名称' in 对象名称`

var obj = {

    a:1,

    b:2,

    c:3

}

//判断 a 属性是否属于 obj 对象

var res  = 'aa' in obj;

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 216,496评论 6 501
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 92,407评论 3 392
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 162,632评论 0 353
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,180评论 1 292
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,198评论 6 388
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,165评论 1 299
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,052评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,910评论 0 274
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,324评论 1 310
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,542评论 2 332
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,711评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,424评论 5 343
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,017评论 3 326
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,668评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,823评论 1 269
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,722评论 2 368
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,611评论 2 353

推荐阅读更多精彩内容