JavaScript之数组、队列、栈

这是我参与8月更文挑战的第3天，活动详情查看： 8月更文挑战

1 数组

1) 创建和初始化数组

let arr1 = new Array() //使用new关键字，就能简单地声明并初始化一个数组
let arr2 = new Array(7) //创建一个指定长度的数组
let arr3 = new Array('one','two','three') // 直接将数组元素作为参数
let arr4 = []
let arr5 = [1,2,3,4]

2) 添加元素

a) 在数组尾部添加元素

let arr = [1,2,3,4,5,6,7,8,9,10,11,12] 
//把13添加到arr中
arr[arr.length] = 13

在JavaScript中，数组是一个可以修改的对象。如果添加元素，它就会动态增长。在C和Java等其他语言里，我们要决定数组的大小，想添加元素就要创建一个全新的数组，不能简单地往其中添加所需的元素。

使用push

arr.push(13) // push方法可向数组的末尾添加一个或多个元素，并返回新的长度

b) 在数组头部插入元素

for(let i=arr.length; i>=0; i--){
  arr[i] = arr[i-1]
}
arr[0] = -1 //把-1插入头部

使用unshift

arr.unshift(-2)
arr.unshift(-4,-3)

3) 删除元素

删除最后一个元素

arr.pop() //从数组中删除最后一个元素，并返回该元素的值。此方法更改数组的长度。

删除数组中第一个元素

arr.shift()//方法用于把数组的第一个元素从其中删除，并返回第一个元素的值。

for(let i=0 ; i < arr.length; i++){
  arr[i] = arr[i+1]
} //数组的长度不变

4) 在数组任意位置添加和删除元素

arr.splice(5,3) //从索引为5的地方往后删除三个数
arr.splice(5,0,2,3,4) //从索引为5的位置删除0个数，插入2、3、4

splice方法接收的第一个参数，表示想要删除或插入的元素的索引值。第二个参数是删除元素的个数。第三个参数往后，就是要添加到数组里的值。

5) js的数组方法

方法名	描述
concat	用于连接两个或多个数组，该方法不会改变现有的数组，而仅仅会返回被连接数组的一个副本。
every	使用指定函数检测数组中的所有元素：如果数组中检测到有一个元素不满足，则整个表达式返回 false ，且剩余的元素不会再进行检测。如果所有元素都满足条件，则返回 true。every() 不会对空数组进行检测。every() 不会改变原始数组。
filter	filter() 方法创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。filter() 不会对空数组进行检测。filter() 不会改变原始数组。
forEach	对数组中的每一项运行给定函数, 这个方法没有返回值
join	将所有的数组元素连接成一个字符串
indexOf	该方法将从头到尾地检索数组，看它是否含有对应的元素。开始检索的位置在数组 start 处或数组的开头（没有指定 start 参数时）。如果找到一个 item，则返回 item 的第一次出现的位置。开始位置的索引为 0。如果在数组中没找到指定元素则返回 -1。array.indexOf(item,start)item 必须。查找的元素。start 可选的整数参数。规定在数组中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数，则将从字符串的首字符开始检索。
lastIndexOf	返回一个指定的元素在数组中最后出现的位置，从该字符串的后面向前查找。如果要检索的元素没有出现，则该方法返回 -1。array.lastIndexOf(item,start)item 必需。规定需检索的字符串值。start 可选的整数参数。规定在字符串中开始检索的位置。它的合法取值是 0 到 array.length - 1。如省略该参数，则将从字符串的最后一个字符处开始检索。
map	对数组中的每一项运行给定函数，返回每次函数调用的结果组成的数组，不会改变原数组。
reverse	颠倒数组中元素的顺序，原先第一个元素现在变成最后一个，同样原先的最后一个元素变成了现在的第一个
slice	slice(start,end), 从已有的数组中返回选定的元素, 返回一个新的数组，包含从 start 到 end （不包括该元素）的数组中的元素。该方法并不会修改数组，而是返回一个子数组。start 必需。规定从何处开始选取。如果是负数，那么它规定从数组尾部开始算起的位置。也就是说，-1 指最后一个元素，-2 指倒数第二个元素，以此类推。end 可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数，那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数，那么它规定的是从数组尾部开始算起的元素。
some	方法用于检测数组中的元素是否满足指定条件（函数提供）如果有一个元素满足条件，则表达式返回true , 剩余的元素不会再执行检测。如果没有满足条件的元素，则返回false。some() 不会对空数组进行检测。some() 不会改变原始数组。
sort	按照字母顺序对数组排序，支持传入指定排序方法的函数作为参数
toString	将数组作为字符串返回
valueOf	返回数组本身
reduce	方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。array.reduce(function(total, currentValue, currentIndex, arr), initialValue)function(total,currentValue, index,arr) 必需。用于执行每个数组元素的函数。total 必需。初始值, 或者计算结束后的返回值。currentValue 必需。当前元素currentIndex 可选。当前元素的索引arr 可选。当前元素所属的数组对象。JS数组reduce()方法详解及高级技巧

ES6和ES7新增的数组方法

方法	描述
copyWithin	用于从数组的指定位置拷贝元素到数组的另一个指定位置中，改变原数组。array.copyWithin(target, start, end)target 必需。复制到指定目标索引位置。start 可选。元素复制的起始位置。end 可选。停止复制的索引位置 (默认为 array.length)。如果为负值，表示倒数。
entries	方法返回一个数组的迭代对象，该对象包含数组的键值对 (key/value)。迭代对象中数组的索引值作为 key， 数组元素作为 value。
keys	方法返回一个包含数组中每个索引键的对象。
values	方法返回一个新的对象，该对象包含数组每个索引的值
includes	如果数组中存在某个元素则返回true，否则返回false。
find	根据回调函数给定的条件从数组中查找元素，如果找到则返回该元素，如果没有符合条件的元素返回 undefined，不改变数组的原始值。
findIndex	根据回调函数给定的条件从数组中查找元素，如果找到则返回该元素在数组中的索引，若没有找到对应元素则返回-1。
fill	用于将一个固定值替换数组的元素，改变原数组。array.fill(value, start, end)value 必需。填充的值。start 可选。开始填充位置。end 可选。停止填充位置 (默认为 array.length)
from	从一个类似数组或可迭代对象创建一个新的，浅拷贝的数组实例。Array.from(arrayLike[, mapFn[, thisArg]])arrayLike 必填 想要转换成数组的伪数组对象或可迭代对象。mapFn 可选 如果指定了该参数，新数组中的每个元素会执行该回调函数。thisArg 可选 执行回调函数 mapFn 时 this 对象。
of	根据传入的参数创建一个新数组

6) 数组排序

let arr = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15]
arr.reverse()//[15, 14, 13, 12, 11, 10, 9, 8, 7, 6, 5, 4, 3, 2, 1]
arr.sort() //[1, 10, 11, 12, 13, 14, 15, 2, 3, 4, 5, 6, 7, 8, 9]

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

arr.sort((a,b) => {
	return a-b
})

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

字符串数组排序

var names =['Ana', 'ana', 'john', 'John']
names.sort() // ["Ana", "John", "ana", "john"]

这是因为JavaScript在做字符比较的时候，是根据字符对应的ASCII值来比较的。例如，A、J、a、j对应的ASCII值分别是65、75、97、106。

虽然在字母表里a是最靠前的，但J的ASCII值比a的小，所以排在a前面。

2 栈

栈的特点是后进先出(LIFO)，新添加的或待删除的元素都保存在栈的同一端，称作栈顶，另一端就叫栈底。在栈里，新元素都靠近栈顶，旧元素都接近栈底。

1) 创建栈

function Stack() { //声明一个类
    let items = [] // 用数组保存栈里面的元素
    push(element(s))//添加一个(或几个)新元素到栈顶。
    pop()//移除栈顶的元素，同时返回被移除的元素。
    peek()//返回栈顶的元素，不对栈做任何修改(这个方法不会移除栈顶的 元素，仅仅返回它)。
    isEmpty()//如果栈里没有任何元素就返回true，否则返回false。 
    clear()//移除栈里的所有元素。 
    size()//返回栈里的元素个数。这个方法和数组的length属性很类似。
}

2) 向栈中添加元素

this.push = function(element){
  items.push(element);
};

3) 从栈中移除元素

this.pop = function(){
  return items.pop(); //栈遵从LIFO原则，因此移出的是最后添加进去的元素。因此用数组的pop方法。
};

4) 查看栈顶元素

this.peek = function(){
  return items[items.length-1];
};

5) 检查栈是否为空

this.isEmpty = function(){
  return items.length == 0;
};

6) 清空栈

this.clear = function(){
  items = [];
};

7) 打印栈元素

this.print = function(){
  console.log(items.toString());
};

8) 计算栈长度

this.size = function(){
  return items.length;
};

3 队列

队列的特点是先进先出(FIFO)，队列在尾部添加新元素，并从顶部移除元素。最新添加的元素必须排在队列的末尾。

1) 创建队列

function Queue() { 
  let items = [];//用数组保存队列中的元素
  enqueue(element(s))//向队列尾部添加一个(或多个)新的项。
  dequeue()//移除队列的第一(即排在队列最前面的)项，并返回被移除 的元素。
  front()//返回队列中第一个元素——最先被添加，也将是最先被移除的 元素。队列不做任何变动(不移除元素，只返回元素信息——与Stack类的 peek方法非常类似)。
  isEmpty()//如果队列中不包含任何元素，返回true，否则返回false。 
  size()//返回队列包含的元素个数，与数组的length属性类似。
}

2)添加元素

this.enqueue = function(element){
  items.push(element);
};

3)移除元素

this.dequeue = function(){
  return items.shift();
};

4) 查看对列头元素

this.front = function(){
  return items[0];
};

5) 检查队列是否为空

this.isEmpty = function(){
  return items.length == 0;
};

6) 获取队列长度

this.size = function(){
  return items.length;
};

7) 打印队列

this.print = function(){
  console.log(items.toString());
};