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

2020-05-20 09:03:57 阅读：149 来源： 互联网

标签：arr console 笔记 js csdn 数组 let Array

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]

标签：arr,console,笔记,js,csdn,数组,let,Array
来源： https://blog.csdn.net/weixin_46211290/article/details/106188089

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9