JS学习3

JS学习3

JavaScript 数组

JavaScript 数组用于在单一变量中存储多个值。

var name = [item1, item2, ...];
var names= new Array("item1", "item2", "item3");

注意：

• 不要最后一个元素之后写逗号。
• [0] 是数组中的第一个元素。[1] 是第二个。数组索引从 0 开始。
• 数组是一种特殊类型的对象。在 JavaScript 中对数组使用 typeof 运算符会返回 “object”。

数组属性和方法

1.length

返回数组的长度（数组元素的数目）。

2.Array.foreach()

<p id="demo"></p>

<script>
var person, text;
person = ["张三", "李四", "王五", "小红"];

text = "<ul>";
person.forEach(myFunction);
text += "</ul>";
document.getElementById("demo").innerHTML = text;

function myFunction(value) {
  text += "<li>" + value + "</li>";
} 
</script>

3.push()

向数组添加新元素

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Lemon");                // 向 fruits 添加一个新元素 (Lemon)

//也可以使用 length 属性向数组添加新元素：

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[fruits.length] = "Lemon";     // 向 fruits 添加一个新元素 (Lemon)

4.Array.isArray()

判断是否为数组

JavaScript 数组方法

1.toString()

把数组转换为数组值（逗号分隔）的字符串

2.join()

把数组转换为数组值（自定义分隔符）的字符串

var fruits = ["Banana", "Orange","Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.join(" * "); 

3.pop()

从数组中删除最后一个元素。
pop() 方法返回“被弹出”的值。

4.push()

在数组结尾处向数组添加一个新的元素。
push() 方法返回新数组的长度。

5.shift()

会删除首个数组元素，并把所有其他元素索引减1。
shift() 方法返回被“位移出”的字符串。

6.unshift()

方法（在开头）向数组添加新元素，旧元素索引加一。
unshift() 方法返回新数组的长度。

7.delete

删除元素

JavaScript 数组属于对象，其中的元素可以使用 JavaScript delete 运算符来删除。
使用 delete 会在数组留下未定义的空洞。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
delete fruits[0];           // 把 fruits 中的首个元素改为 undefined

8. splice()

拼接数组。
splice() 方法返回一个已删除项的数组。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 0, "Lemon", "Kiwi");
// 第一个参数（2）定义了应添加新元素的位置（拼接）。
// 二个参数（0）定义应删除多少元素。
// 其余参数（“Lemon”，“Kiwi”）定义要添加的新元素。

9. concat()

合并（连接）数组。
concat() 方法不会更改现有数组。它总是返回一个新数组。
concat() 方法可以使用任意数量的数组参数：
arr1.concat(arr2, arr3，…)

10.slice()

用数组的某个片段切出新数组。它不会从源数组中删除任何元素。
slice() 可接受两个参数，比如 (1, 3)，会从开始参数选取元素，直到结束参数（不包括）为止。

11.sort()

以字母顺序对数组进行排序。

12.reverse()

反转数组中的元素。

13.数字排序

// 升序
var points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return a - b}); 
// 降序序
var points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return b - a}); 
// 随机
var points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return 0.5 - Math.random()}); 
// 最大值 Math.max.apply([1, 2, 3]) 等于 Math.max(1, 2, 3)。
 Math.max.apply(null, arr);
// 最小值 Math.min.apply([1, 2, 3]) 等于 Math.min(1, 2, 3)。
``Math.min.apply(null, arr);`

14.对象数组排序

通过比较函数来对比属性值：

var cars = [
{type:"Volvo", year:2016},
{type:"Saab", year:2001},
{type:"BMW", year:2010}];
cars.sort(function(a, b){return a.year - b.year});
// 字符串排序
cars.sort(function(a, b){
	  var x = a.type.toLowerCase();
	  var y = b.type.toLowerCase();
	  if (x < y) {return -1;}
	  if (x > y) {return 1;}
	  return 0;
});

JavaScript数组迭代方法

1.Array.forEach()

forEach() 方法为每个数组元素调用一次函数（回调函数）。
该函数接受 3 个参数：

• 项目值 value
• 项目索引 index
• 数组本身 array

2.Array.map()

map() 方法通过对每个数组元素执行函数来创建新数组。
map() 方法不会对没有值的数组元素执行函数。
map() 方法不会更改原始数组。

var numbers1 = [45, 4, 9, 16, 25];
var numbers2 = numbers1.map(myFunction);

function myFunction(value, index, array) {
  return value * 2;
}

3. Array.filter()

filter() 方法创建一个包含通过过滤函数的数组元素的新数组。

var numbers = [45, 4, 9, 16, 25];
var over18 = numbers.filter(myFunction);

function myFunction(value, index, array) {
  return value > 18;
}

4.Array.reduce()

reduce() 方法在每个数组元素上运行函数，以生成（减少它）单个值。

reduce() 方法在数组中从左到右工作。从右到左为 reduceRight（）。

reduce() 方法不会减少原始数组。

var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduce(myFunction);

function myFunction(total, value, index, array) {
  return total + value;
}

此函数接受 4 个参数：

• 总数（初始值/先前返回的值）total
• 项目值 value
• 项目索引 index
• 数组本身 array

5.Array.every()

every() 方法检查所有数组值是否通过测试(返回false或者true)。

6.Array.some()

some() 方法检查某些数组值是否通过了测试(返回false或者true)。

7.Array.indexOf()

indexOf() 方法在数组中搜索元素值并返回其位置。
Array.lastIndexOf()从数组结尾开始搜索。

array.indexOf(item, start)
//tem 	必需。要检索的项目。
//start 可选。从哪里开始搜索。负值将从结尾开始的给定位置开始，并搜索到结尾。

8.Array.find()

find() 方法返回通过测试函数的第一个数组元素的值。

9.Array.findIndex()

findIndex() 方法返回通过测试函数的第一个数组元素的索引。