原生JS笔记——第九天（下）

因为第九天内容较多，且上下内容不连贯，就分开做了笔记。

数组

什么是数组？

• 数组是可以在内存中连续存储多个元素的结构
• 数组的下标索引从0开始.通过length可获取数组的总长度。
• 数组的上下界 [0 , myarr.length-1]
  

如何创建数组？
创建数组对象有三种方法：

• 新建一个长度为零的数组 var 变量名=new Array( );

• 新建一个长度为N的数组 var 变量名=new Array( n );

• 新建一个指定长度的数组，并赋值 var 变量名=new Array( 元素1,元素2,元素3,…);

• 字面量数组 var myarr=[数值1，数值2]; //直接输入一个数组
  
  如何访问数组？

• 数组中的序列号:在JavaScript数组中的元素序列号是从0开始计算的，然后依次加1

• 引用数组元素 :通过数组的序列号可以引用数组元素。

• 为数组元素赋值或取值，其语法规则是：
  为数组元素赋值：数组变量[i]=值；
  使用数组元素为变量赋值：变量名=数组变量[i];

• 通过函数方法创建数组

   var myarr =  new Array();

创建一个新数组

new Array()

括号中各个字符串用逗号隔开

括号中直接输入数字，代表数组长度，每个位置的内容为空（empty）

• 字面量方式创建数组

   var  myarr = [];

如何访问数组？

访问数组

var arr = [10,4,"hello",true];

• 单个访问：通过下标

 console.log(arr[2]);
   
 console.log(arr[arr.length - 1]);

• 多个访问：遍历数组

var arr = [10,4,2,19,7,4];
   
   for(var i = 0; i < arr.length; i++){
   
   ​	console.log(arr[i]);
   
   }
   
   for(var i in arr){      //i下标
   
   ​	console.log(arr[i]);
   
   }
   
   for(var i of arr){      //i元素
   
   ​	console.log(arr[i]);
   
   }

遍历数组新方法

方法一：forEach();

语法：forEach(function(value, index, item){})；

参数解释：
var arr = [“a”, “b”, “c”, “d”];
// value 数组中每个值
// index value在数组中对应的下标
// item 数组本身

arr.forEach(function (value, index, item) {

​ console.log(value, index, item);

});

返回值：使用forEach遍历数组，无返回值

方法二：map();[映射]

语法：arr.map(function(value, index, item))；

参数解释：
// value 数组中每个值
// index value在数组中对应的下标
// item 数组本身

var arr = [1, 2, 3, 4];

var test2 = arr.map(function(value, index, item) {

​ console.log(value, index, item);

​ return value * value;

});

console.log(test2);// [1, 4, 9, 16]

返回值：使用map遍历数组，返回新处理的数组

方法三：filter(); [过滤(筛选)]

语法：arr.filter(function(value, index, item))

参数解释：
// value 数组中每个值
// index value在数组中对应的下标
// item 数组本身

var arr = [100,90,80,70,60,50,40];

var a = arr.filter(function(value,index,item){
				if(value>60){
					return value;
				}
			});

console.log(a);//[50,40]

返回值：使用filter遍历数组，返回新处理的数组

方法四：reduce() [迭代]

语法：arr.reduce(function(total, currentValue, currentIndex,arr))

参数解释：
// total 必需。初始值或计算结束后的返回值

// currentValue 必需。当前元素

// currentIndex 可选。当前元素的索引

// arr 可选。当前元素所属的数组对象。

var arr = [100,90,80,70,60,50,40];

var a = arr.reduce(function(total, currentValue, currentIndex,arr){
				retuen total + currentValue;
			});

console.log(a);//490

返回值：返回迭代计算后的结果

【注意】：

1. forEach方法是四个方法中唯一一个无返回值的方法

2. map方法和filter方法的区别——返回值不同：
   map方法返回值：一一对应，返回数组长度和原数组长度一样，数组有几个值输出几个
   filter方法返回值： 一一对应，返回数组长度和原数组长度不一定一样。筛选后，有几个结果输出几个

数组对象——方法

方法一：pop()

用于删除并返回数组的最后一个元素。

语法:
arrayObject.pop()
用法：
pop() 方法将删除 arrayObject 的最后一个元素，把数组长度减 1，并且返回它删除的元素的值。如果数组已经为空，则 pop() 不改变数组，并返回 undefined 值。

方法二：shift()

用于删除并返回数组的第一个元素。

语法：
arrayObject.shift()
用法：
shift() 方法将删除 arrayObject 的第一个元素，把数组长度减 1，并且返回它删除的元素的值。如果数组已经为空，则 shift() 不改变数组，并返回 undefined 值。

方法三：push()

可向数组的末尾添加一个或多个元素，并返回新数组的长度。

语法：
arrayObject.push(newelement1,newelement2,…,newelementX)
用法：
push() 方法将添加的元素放到原数组尾部，并且返回新数组的长度。

方法四：unshift()

可向数组的头部添加一个或多个元素，并返回新数组的长度。

语法:
arrayObject.unshift(newelement1,newelement2,…,newelementX)
用法：
unshift() 方法将添加的元素放到原数组头部，并且返回新数组的长度。