对于数组,是一些类型数据的组合,合在一起,便于管理,由于js是一种弱语言,不像c,c++等,必须是统一类型的集合,比如都是int型...但js可以存放任意类型的数据。总的来说,数组是一种便于统一管理,不用一个个去单独设置每一项,数组的学习建议与字符串结合起来看。数组和对象不同与普通类型的数据,是引用类型的数据。
字面量形式创建:
1 var arr = [1,true,4,‘hello‘]; 2 console.log(typeof arr); //object
对象形式创建:
1 var arr1 = new Array(1,true,‘hello‘); 2 console.log(typeof arr1); //object 3 console.log(arr1 instanceof Array); //true 由于通过对象形式创建的数字,字符串...和数组,对象typeof检测都是object,所以可以用instanceof检测是否在原型链上
1)转换为字符串
//1.通过String()函数 var arr = [1,2,true,‘hello‘]; console.log(typeof String(arr)); //string //2.通过toString()方法 var arr = [1,2,true,‘hello‘]; arr = arr.toString(); console.log(typeof arr); //string //3.通过数组的连接join()方法 var arr = [1,2,true,‘hello‘]; arr = arr.join(‘-‘); console.log(arr,typeof arr); //1-2-true-hello string
2)转换为数组
//1.Array.from:可将类数组转换为数组,类数组指包含 length 属性或可迭代的对象。第二个参数类似于map 函数的方法,可对数组元素执行函数处理 var str = ‘hello‘; console.log(Array.from(str)); //[ ‘h‘, ‘e‘, ‘l‘, ‘l‘, ‘o‘ ] //2.通过点语法 var str = ‘hello‘; console.log([...str]); //[ ‘h‘, ‘e‘, ‘l‘, ‘l‘, ‘o‘ ]
1)push():压入元素,直接改变元数组,返回值为数组元素数量
1 var str = [1,2]; 2 str.push(‘hello‘,false); 3 console.log(str); //[1,2,‘hello‘,false]
2)pop()方法:从末尾弹出元素,直接改变元数组,返回值为弹出的元素
var arr = [1,2]; console.log(str.pop()); //2 console.log(arr); //[1]
3)shift()方法:从数组前面取出一个元素
var str = [1,2]; console.log(str.shift()); //1 console.log(str); //[2]
4)unshift()方法:从数组前面添加元素
var str = [1,2]; console.log(str.unshift(‘hello‘)); //3 console.log(str); //[‘hello‘,1,2]
5)fill()方法:填充数(可以当替换来使用)
console.log([1,2,3].fill(‘hello‘,1,2)); //[1,‘hello‘,3]
6)slice()方法:截断数组,合成新数组(并不会改变原数组),不传第二个参数时截取到数组的最后元素
var arr = [1,2,3]; var arr1 = arr.slice(); console.log(arr === arr1); //false
7)splice()方法:直接操作原数组,可以实现删除,替换,添加的操作,第一个参数为删除的位置,第二个为数量,可选的为替换的值。
var arr = [1,2,3]; arr.splice(0,1); console.log(arr); //[2,3] arr.splice(arr.length,0,‘hello‘,‘world‘) console.log(arr); //[1,2,3,‘hello‘,‘world‘]
1)将数组改为[],但如果数组还被其他值引用,改方法不好
var arr = [1,2,3]; var arr1 = arr; arr = []; console.log(arr,arr1); //[] [1,2,3]
2)将length设置为0
var arr = [1,2,3]; var arr1 = arr; arr.length = 0; console.log(arr,arr1); //[] []
3)使用splice,pop,shift
方法删除所有数组元素
var arr = [1,2,3]; var arr1 = arr; arr.splice(0,arr.length); while(arr.pop()) {}; console.log(arr,arr1); //[] []
1)join()方法:将数组连接成字符串(不改变原数组):
var arr = [1,2,3]; console.log(arr.join(‘-‘)); //1-2-3 console.log(arr); //[1,2,3]
2)split()方法:将字符串分裂成数组,与join()相反
var str = ‘99,98,95‘; console.log(str.split(‘,‘)); //[‘99‘,‘98‘,‘95‘]
3)concat()方法:连接多个数组
var arr = [1,2,3]; var arr1 = [‘hello‘,‘world‘]; console.log(arr.concat(arr1),arr); //[1,2,3,‘hello‘,‘world‘] [1,2,3]
4)点语法也可以实现连接(推荐使用):
var arr = [1,2,3]; var arr1 = [‘hello‘,‘world‘]; console.log([...arr,...arr1]); //[1,2,3,‘hello‘,‘world‘]
5)copyWithin()方法:从数组中复制一部分到同数组中的另外位置
var arr = [1,2,3,4]; console.log(arr.copyWithin(2,0,2)); //[1,2,1,2]
1)indexOf():从前向后查找元素出现的位置,如果找不到返回 -1
var arr = [1,2,3,4]; console.log(arr.indexOf(4)); //3
2)includes():查找字符串返回值是布尔类型更方便判断
var arr = [1,2,3,4]; console.log(arr.includes(1)); //true
3)find()方法:把值返回,找不到返回undefined
var arr = [1,2,true,‘hello‘]; var f = arr.find((item) => { return item == ‘hello‘; }) console.log(f); //hello
4)findIndex():返回index,找不到返回-1
var arr = [1,2,true,‘hello‘]; var f = arr.findIndex((v) => { return v == ‘hello‘; }) console.log(f); //3
1)reverse()方法:反转数组
var arr = [1,2,3,4,5]; console.log(arr.reverse()); //[5,4,3,2,1]
2)sort()方法:每次使用两个值进行比较 ,参数一与参数二比较,返回正数为降序负数为升序
var arr = [1,4,3,2,6,5]; console.log(arr.sort((a,b) => { return b-a; })) //[6,5,4,3,2,1]
1)for循环:
var arr = [1,4,3,2,6,5]; for(let i =0;i<arr.length;i++) { console.log(arr[i]); //1 4 3 2 6 5 }
2)for...in循环:
var arr = [1,4]; for (const key in arr) { console.log(key,arr[key]); //key为数组的下标 }
3)for...of循环:
var arr = [1,4]; for (const item of arr) { console.log(item); //item就是数组的每一项 }
4)forEach循环:作用在每一个元素上
var arr = [1,4]; arr.forEach((ele,index,item) => { console.log(ele,index,item); //ele代表每一项,index为索引,item代表数组本身 });
5)迭代器方法:
var arr = [1,4]; //keys const keys = arr.keys(); console.log(keys.next()); //{ value: 0, done: false } console.log(keys.next());//{ value: 1, done: false } console.log(keys.next());//{ value: undefined, done: true } //values const values = arr.values(); console.log(values.next()); //{ value: 1, done: false } console.log(values.next()); //{ value: 4, done: false } console.log(values.next()); //{ value: undefined, done: true } //entries const entries = arr.entries(); console.log(entries.next()); //{ value: [ 0, 1 ], done: false } console.log(entries.next()); //{ value: [ 1, 4 ], done: false } console.log(entries.next()); //{ value: undefined, done: true }
1)every()方法:
//every 用于递归的检测元素,要所有元素操作都要返回真结果才为真。 var lessons =[ {name:‘小二‘,grade:60}, {name:‘马六‘,grade:80}, {name:‘张三‘,grade:58} ] var result = lessons.every(user => { user.grade > 60; }) console.log(result); //false
2)some()方法:
var lessons =[ {name:‘小二‘,grade:60}, {name:‘马六‘,grade:80}, {name:‘张三‘,grade:58} ] var result = lessons.some((user,index,arr) => { // console.log(user,index,arr) user:每个元素,index索引,arr整个数组 return user.grade > 60; }) console.log(result); //true
3)filter()方法:过滤元素
var arr = [1,2,3,4,5]; var result = arr.filter((item,index,arr) => { console.log(item,index,arr) return item > 3; }) console.log(result); //[4,5]
4)map()方法:
var arr = [1,2,3,4]; var arr1 =arr.map((elem,index,arr) => { return elem+= 10; }) console.log(arr1,arr); //[11,12,13,14] [1,2,3,4]
5)reduce()方法:
//prev 为上一次返回的值,cur为当前的值,由于这个特性,可以用来求和... //第三个参数index 为索引,array 当前数组 var arr = [1,2,3,4]; var a = arr.reduce((total,cur) => { return total += cur; }) console.log(a,arr);
原文:https://www.cnblogs.com/gxl520/p/14702687.html