JavaScript数据结构与算法-数组

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/u014465934/article/details/88854471

参考资料:《学习JavaScript数据结构与算法》

这本书可以和这个博客一起看:https://github.com/wengjq/Blog
数据结构和算法动态可视化: https://visualgo.net/zh

数组还可以查看参考资料:https://juejin.im/post/5c923e936fb9a070b96f06ff

1.创建和初始化数组

new Array();
new Array(7);
new Array('Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday')
[];
['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'];

2.数组元素的添加和删除

末尾元素的添加删除:push、pop
首位元素的添加和输出:unshift、shift

末尾添加元素:

var numbers = [1,2,3,4,5,6];
numbers[numbers.length] = 7;

数组首位插入元素(实现unshift功能):

//因为往后移一位,此时宽度就是numbers.length,所以有numbers[i]
var numbers = [0,1,2,3,4,5,6,7,8,9]
for(var i=numbers.length;i>=0;i--){
	numbers[i] = numbers[i-1];
}
numbers[0] = -1

数组首位删除元素(实现shift功能):

var numbers = [0,1,2,3,4,5,6,7,8,9]
for(var i=0;i<numbers.length;i++){
	numbers[i]=numbers[i+1];
}

我们注意最后一次是a[10]=a[9],此时a[9]是undefined,整个数组长度不变,只是最后一个是undefined。

3.在任意位置添加或删除元素

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

//从下标开始,删除
[1, 2, 3, 4, 6, 6]
num.splice(1,2)
[1, 4, 6, 6]

splice还有更多参数,我们可以用于添加元素:

num = [1,2,3,4,5,6,7,8,9]
num.splice(1,0,2,2,3,3)
num
[1,2,2,3,3,2,3,4,5,6,7,8,9]

4.JavaScript数组方法参考

在这里插入图片描述

JavaScript数组方法:concat、every、filter、forEach、join、indexOf、lastindexOf、map、reverse、slice、some、sort、toString、valueOf

ECMAScript 6新增的数组方法:@@iterator、copyWithin、entries、includes、find、find Index、fill、from、keys、of、values

ES5中数组方法

//concat
arr = ["George","John","Thomas"];
arr2 = ["James","Adrew","Martin"]
arr.concat(arr2)
["George", "John", "Thomas", "James", "Adrew", "Martin"]

//join
arr = ["George","John","Thomas"];
arr.join()
"George,John,Thomas"
arr.join('.')
"George.John.Thomas"

//slice(如果没有指定end,那么到数组结束的所有元素)
arr = ["George","John","Thomas"];
arr.slice(1)
["John","Thomas"]
arr1 = ["George", "John", "Thomas", "James", "Adrew", "Martin"]
arr1.slice(2,4)
["Thomas","James"]

//indexOf
var str="Hello world!"
str.indexOf("Hello")    0
str.indexOf("World")  -1
str.indexOf("world")   6

//toString() 有点类似默认join效果
["George", "John", "Thomas"]
arr.toString()
"George,John,Thomas"

//valueOf 和toString类似,将数组作为字符串返回

toString 将数组作为字符串返回
valueOf 和toString类似,将数组作为字符串返回

下面是some、every、filter、forEach、map(迭代器函数)

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

//some
numbers.some(isEven);
1
2
true

//every
numbers.every(isEven);
false

//forEach(不需要判断,返回true/false,不需要返回值)
numbers.forEach(function(x){
	console.log((x % 2 == 0));
}); 
false
true
false
true
false
true
false
true
false
true
false
true
false
true
false

//map
numbers.map(isEven)
[false, true, false, true, false, true, false, true, false, true, false, true, false, true, false]

//filter
numbers.filter(isEven);
[2, 4, 6, 8, 10, 12, 14]

some 对数组中的每一项运行给定函数,如果任一项返回true,则返回true.
every 对数组中的每一项运行给定函数,如果该函数对每一项都返回true,则返回true
forEach 对数组中的每一项运行给定函数。这个方法没有返回值
map 对数组中的每一项运行给定函数,返回每次函数调用的结果组成的数组
filter 对数组中的每一项运行给定函数,返回该函数会返回true的项组成的数组

ES5中数组迭代器函数总结:

forEach()无返回值,map()和filter()返回新数组,every()和some()返回布尔值

forEach(),用于遍历数组,用于对数组每一项进行操作,在原数组上操作,无返回值
map(),用于遍历数组,用于对数组每一项进行操作,返回处理之后的新数组
可以看到,该方法与forEach()的功能类似,只不过map()具有返回值,会返回一个新的数组,这样处理数组后也不会影响到原有数组。

every(),用于判断数组中的每一项元素是否都满足条件,返回一个布尔值、some(),用于判断数组中的是否存在满足条件的元素,返回一个布尔值

filter(),用于筛选数组中满足条件的元素,返回一个筛选后的新数组。

参考文章:https://www.jianshu.com/p/b728253c90b5

ES6数组方法:

ECMAScript 6新增的数组方法:@@iterator、copyWithin、entries、includes、find、find Index、fill、from、keys、of、values

[ ].slice.call():https://www.jianshu.com/p/ae57baecc57d
先放结论:[].slice.call(arguments)能将具有length属性的对象转成数组。

Array.from方法用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括 ES6 新增的数据结构 Set 和 Map)。

let arrayLike = {
    '0': 'a',
    '1': 'b',
    '2': 'c',
    length: 3
};

// ES5的写法
var arr1 = [].slice.call(arrayLike); // ['a', 'b', 'c']

// ES6的写法
let arr2 = Array.from(arrayLike); // ['a', 'b', 'c']

只要是部署了 Iterator 接口的数据结构,Array.from都能将其转为数组。

Array.from('hello')
// ['h', 'e', 'l', 'l', 'o']

let namesSet = new Set(['a', 'b'])
Array.from(namesSet) // ['a', 'b']

Array.of方法用于将一组值,转换为数组。

Array.of(3, 11, 8) // [3,11,8]
Array.of(3) // [3]
Array.of(3).length // 1

fill方法使用给定值,填充一个数组。

['a', 'b', 'c'].fill(7)
// [7, 7, 7]

new Array(3).fill(7)
// [7, 7, 7]

copyWithin方法复制数组中的一系列元素到同一个数组指定的起始位置。

Array.prototype.copyWithin(target, start = 0, end = this.length)

[1, 2, 3, 4, 5].copyWithin(0, 3)
// [4, 5, 3, 4, 5]

// 将3号位复制到0号位
[1, 2, 3, 4, 5].copyWithin(0, 3, 4)
// [4, 2, 3, 4, 5]

// -2相当于3号位,-1相当于4号位
[1, 2, 3, 4, 5].copyWithin(0, -2, -1)
// [4, 2, 3, 4, 5]

总结:
Array.from方法根据已有的数组创建一个新数组。
Array.of方法根据传入的参数创建一个新数组。
fill方法用静态值填充数组。
copyWithin方法复制数组中的一系列元素到同一个数组指定的起始位置。

数组实例的find方法,用于找出第一个符合条件的数组成员。
数组实例的findIndex方法的用法与find方法非常类似,返回第一个符合条件的数组成员的位置,如果所有成员都不符合条件,则返回-1。

[1, 4, -5, 10].find((n) => n < 0)
// -5

[1, 5, 10, 15].findIndex(function(value, index, arr) {
  return value > 9;
}) // 2

keys()是对键名的遍历、values()是对键值的遍历,entries()是对键值对的遍历。

for (let index of ['a', 'b'].keys()) {
  console.log(index);
}
// 0
// 1

for (let elem of ['a', 'b'].values()) {
  console.log(elem);
}
// 'a'
// 'b'

for (let [index, elem] of ['a', 'b'].entries()) {
  console.log(index, elem);
}
// 0 "a"
// 1 "b"

数组实例的 includes(),如果数组里存在某个元素,includes方法会返回true,否则返回false。

console.log(numbers.includes(15));
console.log(numbers.includes(20)); 

总结:

indexof 返回第一个与给定参数相等的数组元素的索引,没有找到则返回-1。
find 数组实例的find方法,用于找出第一个符合条件的数组成员,返回找到的数组成员。
findIndex 数组实例的findIndex方法的用法与find方法非常类似,返回第一个符合条件的数组成员的位置,如果所有成员都不符合条件,则返回-1。
include 如果数组里存在某个元素,includes方法会返回true,否则返回false。

toString 将数组作为字符串返回。
value 和toString类似,将数组作为字符串返回。
join 默认情况下,join和上面两个方法一样,’,'组成的字符串,但是join可以指定连接符。

5.数组中排序

主要是两个方法:reverse()和sort()

1.reverse()反向输出数组:

[1, 2, 2, 3, 3, 2, 3, 4, 5, 6, 7, 8, 9]
num.reverse()
[9, 8, 7, 6, 5, 4, 3, 2, 3, 3, 2, 2, 1]

2.不加参数的sort():

[15, 14, 13, 12, 11, 10, 2, 3, 4, 5, 6, 7, 8, 9, 1];
nums.sort();
(15) [1, 10, 11, 12, 13, 14, 15, 2, 3, 4, 5, 6, 7, 8, 9]

因为sort方法在对数组做排序时,把元素默认成字符串进行相互比较。

3.a-b、b-a的sort():

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

[1, 2, 2, 3, 3, 2, 3, 4, 5, 6, 7, 8, 9]
num.sort(function(a,b){return a-b})
[1, 2, 2, 2, 3, 3, 3, 4, 5, 6, 7, 8, 9]

[1, 2, 2, 3, 3, 2, 3, 4, 5, 6, 7, 8, 9]
num1.sort(function(a,b){return b-a})
[9, 8, 7, 6, 5, 4, 3, 3, 3, 2, 2, 2, 1]

a-b升序排序,b-a降序

4.对对象类型的数组排序

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)。

5.对字符串排序

var names =['Ana', 'ana', 'john', 'John'];
console.log(names.sort()); 

你猜会输出什么?答案是这样的:

["Ana", "John", "ana", "john"]

既然a在字母表里排第一位,为何ana却排在了John之后呢?这是因为JavaScript在做字符比较的时候,是根据字符对应的ASCII值来比较的。

现在,如果给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;
}); 

猜你喜欢

转载自blog.csdn.net/u014465934/article/details/88854471