玖叶教程网

前端编程开发入门

前端开发笔记(25)(前端开发笔记本需要独显吗)

JS篇--15

01 数组

  1. 使用
  • 数组字面量[]
var arr = [1, 2, 3];
  • 构造函数new Array()
var arr = new Array(); // 创建一个空数组
var arr = new Array(8); // 创建一个长度为8的空数组,数组里有8个空的数组元素
var arr = new Array(1, 2, 3); // 等价于var arr = [1, 2, 3];数组里有3个数组元素,分别为1、2和3
  1. 属性
  • length:数组中元素的个数
var arr = [1, 2, 3];
console.log(arr.length); // 3
  1. 方法 -- 改变原数组

// 标注:

  • start:开始索引位
  • end:结束索引位

// 添加删除

  • arr.push(元素) :将指定的元素添加到数组的末尾,并返回新的数组长度(本质是将数组的长度作为新元素的索引位,将新元素放入数组)
  • arr.pop():从数组中删除最后一个元素,并返回该元素的值
  • arr.unshift(元素):将指定元素添加到数组的开头,并返回数组的新长度
  • arr.shift():从数组中删除第一个元素,并返回该元素的值
  • arr.splice(start, 删除元素数, 新元素):通过移除或者替换已存在的元素和/或添加新元素就地改变一个数组的内容。start默认为0,删除元素数为undefined时,自动转为0
// 从start开始删除指定的删除元素数后,从start开始插入新元素
var arr = ["angel", "clown", "mandarin", "sturgeon"];
arr.splice(2, 0, "drum");
console.log(arr); // ['angel', 'clown', 'drum', 'mandarin', 'sturgeon']

// 排序

  • arr.reverse()就地反转数组中的元素,并返回同一数组的引用(数组中的元素顺序将被翻转)
var arr = ['one', 'two', 'three'];
console.log('oldArr:', arr); // oldArr: ['one', 'two', 'three']
arr.reverse();
console.log('newArr:', arr); // newArr: ['three', 'two', 'one']
  • arr.sort(函数参数)就地对数组的元素进行排序,并返回对相同数组的引用默认排序是将元素转换为字符串,然后按照它们的 UTF-16 码元值升序排序。参数必须是返回一个数字的函数,该数字正负性表示两个元素的相对顺序
// 一个数字一个数字比
var arr = [11, 30, 4, 21, 100000];
arr.sort();
console.log(arr); // [100000, 11, 21, 30, 4]
// 相减的值为正,两值换位;为负,两值位置不变
var arr = [11, 30, 4, 21, 100000];
arr.sort(function (a, b) {return a - b});
console.log(arr); // [4, 11, 21, 30, 100000]
arr.sort(function (a, b) {return b - a});
console.log(arr); // [ 100000, 30, 21, 11, 4 ]
  1. 方法 -- 不改变原数组

// 判断数组

  • arr.isArray(值):判断值是否是一个数组返回一个布尔值

// 数组转字符串

  • arr.toString()返回一个字符串,表示指定的数组及其元素
  • arr.toLocaleString()返回一个字符串,表示数组中的所有元素
var array1 = [1, 2, 'a', '1a'];
console.log(array1.toString()); // 1,2,a,1a
  • arr.join(分隔符):将一个数组(或一个类数组对象)的所有元素连接成一个字符串返回这个字符串,用逗号(默认)或指定的分隔符字符串分隔。
var array1 = [1, 2, 'a', '1a'];
console.log(array1.join()); // 1,2,a,1a

// 拼接

  • arr.concat(新数组/新元素):合并两个或多个数组,不改变原数组,返回合并后的新数组
var letters = ["a", "b", "c"];
var numbers = [1, 2, 3];
var newArr = letters.concat(numbers);
console.log(letters, numbers); // ['a', 'b', 'c'] [1, 2, 3]
console.log(newArr); // ['a', 'b', 'c', 1, 2, 3]

// 提取

  • arr.slice(start, end):提取数组中从start开始到end结束(不包括end所在元素)的元素并将这些提取出的原数组成新数组返回,不改变原数组
// 从start开始到end之前的元素组成新数组返回
var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1, 3);
console.log(citrus); // ['Orange', 'Lemon']
console.log(fruits); // ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango']

// 查找

  • arr.indexOf(查找元素, start):返回数组中第一次出现给定元素的索引位如果不存在则返回 -1
var array = [2, 9, 9];
console.log(array.indexOf(9)); // 1
  • arr.lastIndexOf(查找元素, start):返回数组中最后一次出现给定元素的索引位如果不存在则返回 -1
var array = [2, 9, 9];
console.log(array.lastIndexOf(9)); // 2

// 遍历

  • arr.every(测试函数):测试数组中是否所有元素都通过指定函数的测试。返回一个布尔值
  • arr.some(测试函数):测试数组中是否至少有一个元素通过指定函数的测试。返回一个布尔值
function isBigEnough(element) {
 return element >= 10;
}
console.log([12, 5, 8, 130, 44].every(isBigEnough)); // false
console.log([12, 54, 18, 130, 44].every(isBigEnough)); // true
console.log([12, 5, 8, 130, 44].some(isBigEnough)); // true
  • arr.forEach(函数):对数组的每个元素执行一次指定函数,返回undefined
  • arr.filter(测试函数):将所有通过测试函数的元素组成一个新数组并返回。如果没有元素通过测试,则返回一个空数组
var words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];
var result = words.filter(function (word) { return word.length > 6 });
console.log(result); // ['exuberant', 'destruction', 'present']
  • arr.map(函数)创建一个新数组,这个新数组由原数组中的每个元素都调用一次指定函数后的返回值组成
var array1 = [1, 4, 9, 16];
var map1 = array1.map(function (x) { return x * 2 });
console.log(map1); // [2, 8, 18, 32]

// 归并

  • arr.reduce(函数, 初始值):对数组中的每个元素按序执行指定函数,每次执行结果作为下一次执行的参数传入,最后将其结果汇总为返回值
var arr = [1, 2, 3, 4];
// 0 + 1 + 2 + 3 + 4
var initialValue = 0;
var sum = arr.reduce(function (accumulator, currentValue) {
 return accumulator + currentValue
}, initialValue);
console.log(sum); // 10
  • arr.reduceRight(函数, 初始值):与arr.reduce(函数, 初始值)累加顺序相反

发表评论:

控制面板
您好,欢迎到访网站!
  查看权限
网站分类
最新留言