JavaScript数据结构与算法学习笔记之数组

目录

一、创建和初始化数组

二、添加和删除元素

三、JavaScript 的数组方法参考

3.1.1数组合并

3.1.2迭代器函数

3.1.3 搜索和排序

3.1.4、输出数组为字符串


一、创建和初始化数组

var daysOfWeek = new Array(); //{1}声明并初始化一个数组
var daysOfWeek = new Array(7); //{2}创建一个指定长度的数组
var daysOfWeek = new Array('Sunday', 'Monday', 'Tuesday', 'Wednesday',
'Thursday', 'Friday', 'Saturday'); //{3}将数组元素作为参数传递给它的构造器

其实,用new创建数组并不是最好的方式。如果你想在JavaScript中创建一个数组,只用中括
号([])的形式就行了,

var daysOfWeek = [];
也可使用一些元素初始化数组,如下:
var daysOfWeek = ['Sunday', 'Monday', 'Tuesday', 'Wednesday',
'Thursday', 'Friday', 'Saturday'];
如果想知道数组里已经存了多少个元素,可以使用数组的length属性。以下代码的输出是7:
console.log(daysOfWeek.length);
要访问数组里特定位置的元素,可以用中括号传递数值位置,得到想知道的值或者赋新的值。
假如我们想输出数组daysOfWeek里的所有元素,可以通过循环遍历数组,打印元素,如下所示:
for (var i=0; i<daysOfWeek.length; i++){
console.log(daysOfWeek[i]);
}
我们来看另一个例子:求斐波那契数列的前20个数字。已知斐波那契数列中第一个数字是1,
第二个是2,从第三项开始,每一项都等于前两项之和:
var fibonacci = []; //{1}
fibonacci[1] = 1; //{2}
fibonacci[2] = 1; //{3}
for(var i = 3; i < 20; i++){
fibonacci[i] = fibonacci[i-1] + fibonacci[i-2]; ////{4}
}
for(var i = 1; i<fibonacci.length; i++){ //{5}
console.log(fibonacci[i]); //{6}
}

二、添加和删除元素

var numbers = [0,1,2,3,4,5,6,7,8,9];

扫描二维码关注公众号,回复: 9433901 查看本文章

1、在最后位置添加元素

numbers.push(11)

2、在首位置添加元素

numbers.unshift(11)

3、在最后位置删除元素

numbers.pop()

4、在首位置删除元素

numbers.shift()

5、如何在数组中的任意位置上删除或添加元素?

     使用splice方法,简单地通过指定位置/索引,就可以删除相应位置和数量的元素:

     numbers.splice(5,3);

    这行代码删除了从数组索引5开始的3个元素。这就意味着numbers[5]、numbers[6]和numbers[7]从数组中删除了。

6、想把数字2、3、4插入数组里,放到之前删除元素的位置上,可以再次使用splice方法:
      numbers.splice(5,0,2,3,4);
      splice方法接收的第一个参数,表示想要删除或插入的元素的索引值。第二个参数是删除
元素的个数(这个例子里,我们的目的不是删除元素,所以传入0)。第三个参数往后,就是要添
加到数组里的值(元素2、3、4)

三、JavaScript 的数组方法参考

concat 连接2个或更多数组,并返回结果
every 对数组中的每一项运行给定函数,如果该函数对每一项都返回true,则返回true
filter 对数组中的每一项运行给定函数,返回该函数会返回true的项组成的数组
forEach 对数组中的每一项运行给定函数。这个方法没有返回值
join 将所有的数组元素连接成一个字符串
indexOf 返回第一个与给定参数相等的数组元素的索引,没有找到则返回-1
lastIndexOf 返回在数组中搜索到的与给定参数相等的元素的索引里最大的值
map 对数组中的每一项运行给定函数,返回每次函数调用的结果组成的数组
reverse 颠倒数组中元素的顺序,原先第一个元素现在变成最后一个,同样原先的最后一个元素变成了现在的第一个
slice 传入索引值,将数组里对应索引范围内的元素作为新数组返回
some 对数组中的每一项运行给定函数,如果任一项返回true,则返回true
sort 按照字母顺序对数组排序,支持传入指定排序方法的函数作为参数
toString 将数组作为字符串返回
valueOf 和toString类似,将数组作为字符串返回

3.1.1数组合并

var zero = 0;
var positiveNumbers = [1,2,3];
var negativeNumbers = [-3,-2,-1];
var numbers = negativeNumbers.concat(zero, positiveNumbers);
concat方法可以向一个数组传递数组、对象或是元素。数组会按照该方法传入的参数顺序
连接指定数组。

3.1.2迭代器函数

假如有一个数组,它值是从1到15,如果数组里的元素可以被2整除(偶数),函数就返回true,否则返回false:
 

var isEven = function (x) {
// 如果x是2的倍数,就返回true
console.log(x);
return (x % 2 == 0) ? true : false;
// 也可以写成return (x % 2 == 0) ? true : false
};
var numbers = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15];
return (x % 2 == 0) ? true : false 也可以写成return (x % 2== 0)。

1、every方法     会迭代数组中的每个元素,直到返回false。

 numbers.every(isEven);

在这个例子里,数组numbers的第一个元素是1,它不是2的倍数(1是奇数), 因此isEven 函
数返回false,然后every执行结束。

2、some方法   会迭代数组的每个元素,直到函数返回true:

numbers.some(isEven);

在我们的例子里,numbers数组中第一个偶数是2(第二个元素)。第一个被迭代的元素是1,
isEven会返回false。第二个被迭代的元素是2,isEven返回true——迭代结束。

3、forEach方法    迭代整个数组 它和使用for循环的结果相同:

numbers.forEach(function(x){
console.log((x % 2 == 0));
});

4、map:会返回新数组的遍历方法

var myMap = numbers.map(isEven);

数组myMap里的值是:[false, true, false, true, false, true, false, true,false, true, false, true, false, true, false]。它保存了传入map方法的isEven函数的运行结果。这样就很容易知道一个元素是否是偶数。比如,myMap[0]是false,因为1不是偶数;myMap[1]是true,因为2是偶数。

5、filter方法:它返回的新数组由使函数返回true的元素组成

var evenNumbers = numbers.filter(isEven);

在我们的例子里,evenNumbers数组中的元素都是偶数:[2, 4, 6, 8, 10, 12, 14]。

6、reduce方法:reduce方法接收一个函数作为参数,这个函数有四个参数:
previousValue、currentValue、index和array。这个函数会返回一个将被叠加到累加器的
值,reduce方法停止执行后会返回这个累加器。如果要对一个数组中的所有元素求和,这就很
有用,比如:

numbers.reduce(function(previous, current, index){
   return previous + current;
});

输出将会是120。

3.1.3 搜索和排序

1、reverse方法:让数组内元素反序

numbers.reverse();

现在,输出numbers的话就会看到[15, 14, 13, 12, 11, 10, 9, 8, 7, 6, 5, 4, 3,2, 1]。然后,我们用sort方法:

numbers.sort();

然而,如果输出数组,结果会是[1, 10, 11, 12, 13, 14, 15, 2, 3, 4, 5, 6, 7, 8,9]。看起来不大对,是吧?这是因为sort方法在对数组做排序时,把元素默认成字符串进行相互比较。我们可以传入自己写的比较函数,因为数组里都是数字,所以可以这样写:

numbers.sort(function(a, b){
    return a-b;
});

这段代码,对于b大于a时,会返回负数,反之则返回正数。如果相等的话,就会返回0。也就是说返回的是负数,就说明a比b小,这样sort就根据返回值的情况给数组做排序。

之前的代码也可以被表示成这样,会更清晰一些:

function compare(a, b) {
    if (a < b) {
        return -1;
    }
    if (a > b) {
        return 1;
    }
    // a必须等于
    return 0;
}
numbers.sort(compare);

这是因为JavaScript的sort方法接受compareFunction作为参数,然后sort会用它排序数组。在例子里,我们声明了一个用来比较数组元素的函数,使数组按升序排序。

1. 自定义排序
我们可以对任何对象类型的数组排序,也可以创建compareFunction来比较元素。例如,
对象Person有名字和年龄属性,我们希望根据年龄排序,就可以这么写:

var friends = [
    {name: 'John', age: 30},
    {name: 'Ana', age: 20},
    {name: 'Chris', age: 25}
];
function comparePerson(a, b){
    if (a.age < b.age){
        return -1
    }
    if (a.age > b.age){
        return 1
    }
    return 0;
}
console.log(friends.sort(comparePerson));

在这个例子里,最后会输出Ana(20), Chris(25), John(30)。

2. 字符串排序
假如有这样一个数组:
var names =['Ana', 'ana', 'john', 'John'];
console.log(names.sort());
你猜会输出什么?答案是这样的:
["Ana", "John", "ana", "john"]
既然a在字母表里排第一位,为何ana却排在了John之后呢?这是因为JavaScript在做字符比较的时候,是根据字符对应的ASCII值来比较的。例如,A、J、a、j对应的ASCII值分别是65、75、7、106。
虽然在字母表里a是最靠前的,但J的ASCII值比a的小,所以排在a前面。

现在,如果给sort传入一个忽略大小写的比较函数,将会输出["Ana", "ana", "John","john"]:
 

names.sort(function(a, b){
    if (a.toLowerCase() < b.toLowerCase()){
        return -1
    }
    if (a.toLowerCase() > b.toLowerCase()){
        return 1
    }
    return 0;
});

3. 搜索
搜索有两个方法:indexOf方法返回与参数匹配的第一个元素的索引,lastIndexOf返回
与参数匹配的最后一个元素的索引。我们来看看之前用过的numbers数组:

console.log(numbers.indexOf(10));
console.log(numbers.indexOf(100));


在这个示例中,第一行的输出是9,第二行的输出是-1(因为100不在数组里)。
下面的代码会返回同样的结果:

numbers.push(10);
console.log(numbers.lastIndexOf(10));
console.log(numbers.lastIndexOf(100));

我们往数组里加入了一个新的元素10,因此第二行会输出15(数组中的元素是1到15,还有10),第三行会输出-1(因为100不在数组里)。

3.1.4、输出数组为字符串

现在,我们学习最后两个方法:toString和join。
如果想把数组里所有元素输出为一个字符串,可以用toString方法:

console.log(numbers.toString());

1、2、3、4、5、6、7、8、9、10、11、12、13、14、15和10这些值都会在控制台中输出。
如果想用一个不同的分隔符(比如-)把元素隔开,可以用join方法:

var numbersString = numbers.join('-');
console.log(numbersString);

这将输出:
1-2-3-4-5-6-7-8-9-10-11-12-13-14-15-10
如果要把数组内容发送到服务器,或进行编码(知道了分隔符,解码也很容易),这会很
有用。

发布了72 篇原创文章 · 获赞 6 · 访问量 2万+

猜你喜欢

转载自blog.csdn.net/hongyu799/article/details/104109397