js学习笔记（数组的基本使用）

Array 数组的基本使用

声明

const array = new Array('c','s','d','n');
const arr = ['c','s,'d','n'];
console.log(typeof arr); => object
//数组是引用类型数据,属于object(对象)

let arr = new Array(6); 
console.log(arr[0]); => undefined
//new Array(6)创建了一个数组，数组内部为6个undefined
let arr1 = Array.of(6);
console.log(arr1[0]); => 6
//当创建的数组中只有一个值时，可以使用Array.of()方法
let arr2 = [6];
//当然也可以使用字面量来创建

引用类型传址

let arr1= [1,2,3,4,5];
let arr2 = arr1;
arr2[0] = 8;
console.log(arr1); => [8,2,3,4,5]
/引用类型数据在赋值时，是将数据在内存中的地址赋值给变量
若改变变量arr2的值,会影响到变量arr1/
//arr1和arr2中保存的是同一块内存地址中的数据

如图所示：

多维数组嵌套及扁平化处理

let array = [['csdn'],['csdn.com','bilibili.com']];
array[1][0] => csdn.com

let arr = [{ name:'php',click:12 },
		   { name:'js', click:10 },
		   { name:'vue',click:15 }]
arr[1].name => js

//扁平化嵌套数组
let arr = [[1,2,3],[]3,4,5],[6,7,8,[11,12,[12,13,14]],10];

arr.flat(Infinity); => [1,2,3,3,4,5,6,7...]
//使用es6中提供的Array.prototype.flat( )方法 

arr.toString().split(',').map(item=>Number(item))；
//非es6情况下，也可以对嵌套数组使用toString()方法，再使用split()方法转回数组
//该方法下数组的每一项会变为字符串，如果需要变更为数值
//则可以使用map()方法遍历数组并对每一项进行处理。

arr = JSON.stringify(arr) => "[[1,2,3],[]3,4,5],[6,7,8,[11,12,[12,13,14]],10]"
arr.replace(/(\[|\])/g, '') =>  [1,2,3,3,4,5,6,7...]
//可以使用JSON.stringify()方法转为JSON格式的字符串，再使用正则匹配“[]”进行替换

数组的类型转换

1. 将数组转为字符串
let arr = [1,2,3,4,5];

arr.toString(); => 1,2,3,4,5
String(arr);
arr.join('-') => 1-2-3-4-5

2. 将字符串转换为数组
let str = 'csdn';
str.split(''); => ['c','s','d','n']

let str1 = 'csdn.com'
str.split('.') => ['csdn','com']

let str2 = 'csdn';
Array.from(str2); =>  ['c','s','d','n']
//只要（对象）具有length属性(比如arguments对象、dom元素等)，就可以使用Array.from将其转为数组

es6展开语法

let arr1 = ['html','css'];
let arr2 = ['js','vue'];
let  arr =[...arr1, ...arr2]; => ['html','css','js','vue']

使用数组的方法操作DOM节点元素

<div>csdn.com</div>
<div>bilibili.com</div>
const divs = document.querySelectorAll('div');

Array.from(divs).map(item=>console.log(item));
1.使用Array.from将DOM元素转为数组

Array.prototype.map.call(divs, (item)=> console.log(item));
2.使用数据原型链上的map方法，并使用call改变函数的this指向divs

[...divs].map(item=>console.log(item));
3.使用...语法展开并转换为数组

解构语法

let arr = ['csdn','csdn.com']
let [name, site] = [arr];
console.log(name); => csdn
console.log(site)l => csdn.com

const [...arr] = "csdn";
console.log(arr) => ['c','s','d','n']

let [, ...args] = ['csdn','csdn.com', 2010];
console.log(args) => ['csdn.com', 2010]