数组+ES6中的“解构赋值”
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 <script type="text/javascript"> 7 /* 8 数组对象 9 数组也是一个变量 10 它和我们普通对象功能类似，也是用来储存一些值的 11 不同的是 12 普通对象是使用字符串作为属性名的 13 而数组是使用数字来作为索引来操作对象 14 索引 从0开始的整数 15 数组的存储性能比普通对象好，在开发中我们经常使用数组来存储一些数据 16 */ 17 var arr=new Array(); 18 console.log(typeof arr);//object 使用typeof检查一个数组时,会返回<object> 19 arr[0]=0; 20 arr[1]=1; 21 console.log(arr);//输出数组 22 console.log(arr[3]);//如果读取不存在的索引不会报错,会返回undefined 23 /* 24 获取数组长度 25 使用 数组.length 26 对于连续的数组，使用length可以获取到数组的长度（元素的个数） 27 对于非连续的数组，使用length会获取到数组的最大的索引+1 28 尽量不要创建非连续的数组 29 */ 30 console.log(arr.length); 31 arr.length=10;//修改数组的长度 32 //如果修改的length大于原长度,则多出的部分会空出来,如果修改后的长度大于原长则多余的部分会被删除 33 //向数组的最后一个位置添加元素 34 arr[arr.length]=7; 35 36 </script> 37 <head> 38 <body> 39 </body> 40 </html>
数组字面量
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 <script type="text/javascript"> 7 /* 8 9 */ 10 //使用字面量创建数组时,可以在创建时指定数组中的元素 11 var arr=[1,2,3,4,5]; 12 //使用构造函数创建数组时,也可以同时添加元素,将要添加的元素作为构造函数的参数传递 13 //元素之间用,隔开 14 var arr2=new Array(10,20,30); 15 16 //创建一个数组数据只有一个元素10 17 arr=[10]; 18 //创建一个长度为10的数组 19 arr2=new Array(10); 20 //数组中的元素块元素任意的数据类型 21 arr=["hi",12,true,null,undefined]; 22 //二维数组 23 arr=[[1,2,3],[4,5,6],[7,8,9]]; 24 25 </script> 26 <head> 27 <body> 28 </body> 29 </html>
数组的四个方法 push pop unshift shift
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 <script type="text/javascript"> 7 /* 8 push() 9 该方法可以向数组的末尾添加一个或多个元素，并返回数组新的长度 10 可以将要添加的元素作为方法的参数传递 11 这样这些元素将会自动添加到数组的末尾 12 */ 13 var arr=[]; 14 var num=arr.push("123"); 15 console.log(arr); 16 console.log("num="+num);//返回新的长度 17 /* 18 pop() 19 该方法可以删除数组的最后一个元素,并返回数组删除的元素 20 */ 21 var result=arr.pop(); 22 console.log(arr); 23 console.log(result); 24 /* 25 unshift() 26 向数组开头添加一个或多个元素，并返回新的长度 27 向前面插入元素后，其他元素的索引会一次调整 28 29 shift() 30 可以删除数据的第一个元素，并将被删除的元素作为返回值返回 31 */ 32 33 </script> 34 <head> 35 <body> 36 </body> 37 </html>
ES6中的“解构赋值”
1 /* 2 * ES6中的“解构赋值”:主要针对于对象和数组,左侧定义和右侧值类似的结构,这样声明几个变量,快速获取到每一部分的信息 3 */ 4 // 数组解构赋值 5 // let arr = [10, 20, 30, 40]; 6 // let [x, y] = arr; 7 // console.log(x, y); //10 20 8 9 // let [x, ...y] = arr; 10 // console.log(x, y); //10 [20,30,40] 11 // // “...”剩余运算符:把除了x以外，剩下数组中的每一项都拿到，存放到y中(y是一个新的数组) 12 13 // let [, , x, y] = arr; 14 // console.log(x, y); //30 40 15 16 // let [, , , x, y = 0] = arr; 17 // console.log(x, y); //40 0 “y=0”如果不存在y这一项,我们给其赋值默认值,否则它就是undefined的 18 19 // 需求:变量交换值 20 // let a = 10; 21 // let b = 20; 22 /* let c = a; 23 a = b; 24 b = c; 25 console.log(a, b); //20 10 */ 26 27 /* a = a + b; //30 28 b = a - b; //10 a-b此时是原始a的值 相当于把原始a的值放入到b中了 29 a = a - b; //20 a-b此时是原始b的值 相当于把原始b的值放入到a中了 30 console.log(a, b); */ 31 /* 32 [b, a] = [a, b]; //右侧自己构建一个数组 [10,20] 33 console.log(a, b); */ 34 35 // 对象的解构赋值 36 // let obj = { 37 // name: '珠峰培训', 38 // age: 11, 39 // teacher: '周老师', 40 // 0: 100 41 // }; 42 43 // 默认情况下声明的“变量”需要和“属性名”保持一致，这样对象才可以获取到指定成员的值 44 /* let { 45 name, 46 age 47 } = obj; 48 console.log(name, age); //=>obj.name obj.age “珠峰培训” 11 */ 49 50 /* // let {x} = obj; 51 // console.log(x); //obj.x undefined 52 let name = 'xx'; 53 let { 54 name: x 55 } = obj; 56 console.log(x); //“珠峰培训” 声明一个x的变量，让其等于obj.name “解构过程中的重新命名:随意声明一个变量,获取对象中指定成员的值” */ 57 58 /* let { 59 x = 0 60 } = obj; 61 console.log(x); //如果不存在这个属性，则给其赋值默认值0 */ 62 63 /* let { 64 0: x 65 } = obj; 66 console.log(x); //100 对于数字属性名，我们则重新命名一个新的变量接收值即可 */ 67 68 69 // 需求:获取当前数据中的 班级、姓名、数学成绩 三项的值获取到，xx班的xx同学的数学成绩:xx 70 /* let data = [ 71 1001, 72 '精英A班', 73 { 74 name: '王杨波', 75 age: 25, 76 score: [98, 100, 89] //语文 数学 英语 77 } 78 ]; 79 80 let [, className, { 81 name, 82 score: [, math] 83 }] = data; 84 console.log(`${className} 的 ${name} 同学的数学成绩: ${math} 分`); */ 85 86 // 一点点获取 87 /* let className = data[1]; 88 let baseInfo = data[2]; 89 let name = baseInfo.name; 90 let score = baseInfo.score; 91 let math = score[1]; 92 console.log(className, name, math); */
