JS 数组

1.JavaScript中数组的特点

  1. 数组长度可以动态改变。
  2. 同一个数组中可以存储不同的数据类型。
  3. 数据的有序集合
  4. 每个数组都有一个length属性,表示的是数组中元素的个数

2.数组的创建

1.字面量方式创建

var arr = []; //使用字面量声明一个数组
var arr = [10,"a"]; //多个数据之间用逗号隔开
console.log(arr.length); //数组的长度:数组中元素的个数

2.访问数组中的元素
使用数组的下标(索引、index)
从0开始...

console.log(arr[0]); //访问数组中下标为0的元素(第一个元素)
console.log(arr[3]); //当访问的元素不存在,则返回undefined

3.修改数组中的元素

arr[0] = 20;
console.log(arr) // 修改为[20,"a"]
arr[10] = 100; //动态的添加下标为10的元素为 100,数组长度为11;中间未定义的为undefined
console.log(arr.length) //11

4.使用构造函数创建

var arr = new Array(10,"a","b") //创建一个数组,数组中有三个元素
console.log(arr.length); // 3
console.log(arr[arr.length - 1]) ;

只传入一个参数,并且参数是整数number,则这个整数number表示创建的数组的长度

3.数组的长度

arr.length  = 5; //修改数组长度为5;

4.数组的遍历

1.使用for循环遍历数组

var arr = [10,20,30,"a","b"];
for(var i = 0 ; i < arr.length; i ++){
  console.log(arr[i]); //遍历出数组中的每一个元素
}

2.使用for...in 来遍历数组

for(var i in arr){ //遍历出来的 i 是数组的下标
  console.log(arr[i]); //遍历出数组中的每一个元素
}

3.使用for...of 来遍历数组
只能访问数组中的元素,不能修改

for(var s of arr){ 
  console.log(s); //遍历出数组中的每一个元素
}

4.使用forEcah()方法遍历数组

arr.forEach( function(element, index) {
  alert(element);
});
//调用数组的forEach方法,传入一个匿名函数
//匿名函数接受两个参数:   参数1--迭代遍历的那个元素  参数2:迭代遍历的那个元素的下标
//可以在匿名函数内部书需要的代码
1.png

传入一个回调函数,每遍历出一个元素,这个回调函数就被执行一次!


2.png

5.数组常用方法

1.转换方法
toString() 方法 和 join()

1.png

2.栈方法(操作末尾)
push和pop就是用来向数组的末尾添加和删除元素的。

2.png

栈:一种数据结构。特点:FILO (先进后出)

var arr = [10,20,3,5,7,"a","b"];
//返回入栈成功之后数组的最新长度!
arr.push("abc");//入栈、其实就是把元素添加在数组的末尾!
arr.pop(); //出栈,其实就是删除数组的最后一个元素
console.log(arr)

入栈:push
其实就是把元素添加到数组的末尾
出栈:pop
其实就是删除数组的最后一个元素

3.队列方法(操作最初位置)
队列也是一种数据结构。 特点:FIFO(先进先出)
操作数组最初位置的元素

var arr = [10,20,3,5,7,"a","b"];
arr.shift(); //删除数组的最初位置的元素,一次只能删除一个
arr.unshift(100,200);//在最初的元素之前添加,可以同时添加多个元素
console.log(arr);

添加:unshift
可以一次添加多个
删除:shift
一次只能删除一个

4.数组元素倒置
reverse()

var arr = [10,20,3,5,7,"a","b"];
arr.reverse();//把数组中的元素倒置,直接修改了原数组。
console.log(arr);// ["b","a",7,5,3,20,10]

5.查找数组的下标
indexOf(item): 从前面开始向后查找 item 第一次出现的位置
lastIndexOf(item): 从尾部开始向前查找 item 第一次出现的位置

indexOf(item, fromBack): 从第二个参数的位置开向后始查找 item 第一次出现的位置
lastIndexOf(item, fromForward): 从第二个参数的位置开始向前查找 item 第一次出现的位置

console.log(arr.indexOf(100));//从前向后查找,查找元素首次出现
的位置,如果找不到该元素,则返回-1
console.log(arr.indexOf(10,1)); //参数1:要查找的元素  参数2:开始查找的位置

6.concat()方法 (不会影响原数组)
专门用来连接数组的,返回一个全新的数组。

7.png

7.slice()方法 (不会影响原数组)
从原数组中截取出来一个新的数组,不会影响原数组

var arr1 = arr.slice(0,2);//前闭后开 不包括2(从下标为0截取到下标为2的数)
var arri2 = arr.slice(1); //从下标 为1的数截取到末尾
var arri3 = arr.slice(); // 把原数组拷贝过来

8.splice()方法
arr.splice(参数1,参数2,参数3,.....,参数n)
参数1:下标为 的位置开始
参数2:要操作的个数
参数3..参数n:要添加的元素

8.png

9.instanceof 和 Array.isArray()
判断是否为数组

10.二维数组(一维数组模拟)
俗一点就是:数组里边套数组。

var arr = [ [1,2], [3,4],[2,4],3,2,"2"];
console.log(arr[0][1];
for(var i = 0; i < arr.length; i++){
  for(var j = 0; j < arr[i].length; j++){
    console.log(arr[i][j]);//遍历出全部元素
  }
}

11.数组比较

var arr1 = [1,2];
var arr2 = [1,2];
console.log(arr1 == arr2); //false  如果两边都是对象,比较的是地址值

如果两边都是对象,比较的是地址值
如果有一方不是对象,则会进行类型的转换

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

推荐阅读更多精彩内容