JavaScript数据结构 ---- 数组 2
JavaScript数据结构 ---- 数组
2. 存取函数
2.1 查找元素
使用 indexOf( ) 函数来查找参数在数组中是否存在。若存在,就返回该元素在数组中的索引;若不存在,返回 -1。
var langs = ["C", "C++", "Java", "C#", "Python", "PHP"];
var lang1 = "Java";
var lang2 = "Go";
console.log(langs.indexOf(lang1)); // 2
console.log(langs.indexOf(lang2)); // -1
如果数组中包含相同的元素,indexOf() 函数总是返回第一个与参数相同的元素的索引。lastIndexOf() 功能与 indexOf() 相似,不过它是从右往左开始匹配。
var langs = ["C", "C++", "Java", "C#", "Python", "PHP", "Java"];
var lang1 = "Java";
console.log(langs.indexOf(lang1)); // 2
console.log(langs.lastIndexOf(lang1)); // 6
2.2 数组转换为字符串
方法 join() 和 toString() 可以将数组转换为字符串。
var langs = ["C", "C++", "Java", "C#", "Python", "PHP"];
var langStr1 = langs.join();
var langStr2 = langs.toString();
console.log(langStr1); // C,C++,Java,C#,Python,PHP
console.log(langStr1 === langStr2); // true
2.3 派生数组
方法 concat() 会先创建当前数组的一个副本,然后将接收到的参数添加到这个副本的末尾,最后返回新构建的数组。
var lang1 = ["C", "C++", "C#"];
var lang2 = ["Java", "Python", "PHP"];
var newLang = lang1.concat(lang2);
console.log(newLang); // ["C", "C++", "C#", "Java", "Python", "PHP"]
方法 slice() 从现有数组里截取一个新数组。在只传入一个参数的情况下, slice() 返回从该参数指定位置开始到当前数组末尾的所有项;如果传入了两个参数,该方法返回起始位置到结束位置之间的所有项(包括起始位置,不包括结束位置)。slice() 不会改变原数组。 ```js var langs = ["C", "C++", "Java", "C#", "Python", "PHP"]; var lang1 = langs.slice(1); var lang2 = langs.slice(1,5); console.log(lang1); // ["C++", "Java", "C#", "Python", "PHP"] console.log(lang2); // ["C++", "Java", "C#", "Python"] ```
方法 splice() 主用用来向数组中插入项,主要有以下使用方式:
**删除:** 可以删除任意项数,需指定 2 个参数:要删除的起始项的位置以及要删除的项数。(eg: splice(0, 2) 会删除数组中的前两项。) ```js var langs = ["C", "C++", "Java", "C#", "Python", "PHP"]; var remove = langs.splice(0,3); console.log(langs); // ["C#", "Python", "PHP"] console.log(remove); // ["C", "C++", "Java"] ``` **插入**:可以插入任意项数,需指定 3 个参数:起始位置,0(要删除的项数),要插入的项(可以插入多项)。(eg:splice(2, 0, "Ruby", "Perl") 会在当前数组位置 2 开始插入两个字符串 “Ruby”和 “Perl”。) ```js var langs = ["C", "C++", "Java", "C#", "Python", "PHP"]; var insert = langs.splice(2, 0, "Ruby", "Perl"); console.log(langs); // ["C", "C++", "Ruby", "Perl", "Java", "C#", "Python", "PHP"] console.log(insert); // [] 一个空数组 ``` **替换**:可以插入任意项数,需指定 3 个参数:起始位置,要删除的项数,要插入的项(可以插入多项)。(eg:splice(2, 1, "Ruby", "Perl") 会删除在当前数组位置 2 的项,然后再从位置 2 开始插入字符串 “Ruby”和 “Perl”。) ```js var langs = ["C", "C++", "Java", "C#", "Python", "PHP"]; var insert = langs.splice(2, 1, "Ruby", "Perl"); console.log(langs); // ["C", "C++", "Ruby", "Perl", C#", "Python", "PHP"] console.log(insert); // ["Java"] ```
3. 可变函数
3.1 给数组添加元素
有两个方法可以为数组添加元素:push() 和 unshift() 。push() 方法会将一个元素添加到数组末尾。
var num = [1,2,3,4,5];
num.push(6);
console.log(num); // [1, 2, 3, 4, 5, 6]
而 unshift() 方法可以将元素添加在数组的开头。
var num = [2,3,4,5];
num.unshift(1);
console.log(num); // [1, 2, 3, 4, 5]
3.2 从数组中删除元素
使用 pop() 方法可以删除数组末尾的元素。
var num = [1,2,3,4,5];
num.pop();
console.log(num); // [1, 2, 3, 4]
shift() 方法可以删除数组的第一个元素。
var num = [1,2,3,4,5];
num.shift();
console.log(num); // [2, 3, 4, 5]
用上面讲的 splice() 方法可以从数组中间添加和删除元素
3.3 数组排序
方法 reverse() 和方法 sort() 可为数组排序。其中 reserve() 方法将数组中元素的顺序进行翻转。
var num = [1,2,3,4,5];
num.reverse();
console.log(num); // [5, 4, 3, 2, 1]
sort() 方法是按字典顺序对元素进行排序。
var langs = ["Java", "Python", "PHP", "C#"];
langs.sort();
console.log(langs); // ["C#", "Java", "PHP", "Python"]
使用 sort() 方法对数字排序时会出现问题,可以通过写一个大小比较函数,排序时 sort() 方法根据该函数比较数组中两个元素的大小,决定整个数组的顺序。
function compare(num1, num2) {
return num1 - num2;
}
var num = [100, 20, 3, 0.4];
num.sort(compare);
console.log(num); // [0.4, 3, 20, 100]
4. 迭代器
4.1 不生成新数组的迭代器
forEach() 方法接受一个函数作为参数,对数组中的每个元素使用该函数。
function sqrt(n) {
console.log(n, Math.sqrt(n));
}
var num = [1,2,3,4,5];
num.forEach(sqrt);
/*
1 1
2 1.4142135623730951
3 1.7320508075688772
4 2
5 2.23606797749979
*/
every() 方法接受一个返回值为布尔类型的函数,对数组中的每个元素使用该函数。如果对所有的元素都返回 ture,则该方法返回 true。
function isEven(n) {
return n % 2 == 0;
}
var num1 = [1,2,3,4,5];
var num2 = [2,4,6,8,10];
var even1 = num1.every(isEven);
var even2 = num2.every(isEven);
console.log(even1); // false
console.log(even2); // true
some() 方法接受一个返回值为布尔类型的函数,只要有一个元素使得该函数返回 true,则该方法就返回 true。
function isEven(n) {
return n % 2 == 0;
}
var num1 = [1,2,3,4,5];
var num2 = [2,4,6,8,10];
var even1 = num1.some(isEven);
var even2 = num2.some(isEven);
console.log(even1); // true
console.log(even2); // true
reduce() 方法接受一个函数,返回一个值。该方法会从一个累加值开始,不断对累加值和数组中的后续元素调用该函数,最后返回得到的累加值。
function add(now, last) {
return now + last;
}
var num = [1,2,3,4,5];
var sum = num.reduce(add);
console.log(sum); // 15
reduceRight() 方法和 reduce() 方法相似,不过它是从右到左执行。
4.2 生成新数组的迭代器
有两个迭代器方法会产生新数组:map(), filter() 。map() 对数组中每个元素使用某个函数,并返回一个新数组。
function curve(age) {
return age + 10;
}
var ages = [10,20,30,40,50];
var newAges = ages.map(curve);
console.log(newAges); // [20, 30, 40, 50, 60]
filter() 方法传入一个返回值为布尔类型的函数,对数组中的所有元素应用该函数,返回一个新数组,新数组包含应用该函数后结果为 true 的元素。
function isEven(n) {
return n % 2 == 0;
}
var num = [1,2,3,4,5];
var even = num.filter(isEven);
console.log(even); // [2, 4] -- 新数组
console.log(num); // [1, 2, 3, 4, 5] --旧数组
参考资料:
JavaScript高级程序设计
JavaScript MDN
Data Structures and Algorithms with JavaScript