一、String对象

1.1 slice

  • stringObject.slice(start, end)
1
2
3
4
5
6
var a = 'Hello world!';
var b = a.slice(2);
var c = a.slice(-4, -2);
// a: 'Hello world!'
// b: 'llo world!'
// c: 'rl',参数可为负

1.2 substr

  • stringObject.substr(start, length)
1
2
3
4
5
6
var a = 'Hello world!';
var b = a.substr(0, 4);
var c = a.substr(-5, 2);
// a: 'Hello world!'
// b: 'Hell'
// c: 'or',参数可为负

1.3 substring

  • stringObject.substring(start, stop)
1
2
3
4
5
6
7
8
var a = 'Hello world!';
var b = a.substring(0, 4);
var c = a.substring(3, 2);
var d = a.substring(0, -1);
// a: 'Hello world!'
// b: 'Hell'
// c: 'l',start比stop小,交换这两个参数
// d: '',参数为负,返回空字符串

slicesubstrsubstring都是字符串的切割方法,三者之间有细微的区别,根据不同的使用场景可以灵活使用。三种方法都是生成新的字符串,而不是修改原string

二、Array对象

2.1 concat

  • 参数可以为具体的值,也可以为数组对象,可以任意多个。不改变现有的数组,返回被连接数组的一个副本。
1
2
3
4
5
6
var a = [1, 2, 3];
var b = a.concat(4, 5);
var c = a.concat([4, 5]);
// a: [1, 2, 3]
// b: [1, 2, 3, 4, 5]
// c: [1, 2, 3, 4, 5]

2.2 pop

  • 删除 arrayObject 的最后一个元素,把数组长度减 1,并且返回它删除的元素的值。如果数组已经为空,则 pop() 不改变数组,并返回 undefined 值。该方法会改变原数组
1
2
3
4
var a = [1, 2, 3];
var b = a.pop();
// a: [1, 2],修改了原数组
// b: 3,返回删除元素的值

2.3 push

  • 参数顺序添加到 arrayObject 的尾部,直接修改arrayObject
1
2
3
4
var a = [1, 2, 3];
var b = a.push(4, 5);
// a: [1, 2, 3, 4, 5],修改了原数组
// b: 5,返回修改后的数组的长度

2.4 shift

  • 把数组的第一个元素从其中删除,并返回第一个元素的值。如果数组是空的,那么 shift() 方法将不进行任何操作,返回undefined值。该方法会改变原数组。类比pop方法
1
2
3
4
var a = [1, 2, 3];
var b = a.shift();
// a: [2, 3],修改了原数组
// b: 1,返回删除元素的值

2.5 unshift

  • 向数组的开头添加一个或更多元素,并返回新的长度。该方法的第一个参数将成为数组的新元素 0,如果还有第二个参数,它将成为新的元素 1,以此类推
1
2
3
4
var a = [1, 2, 3];
var b = a.unshift(4, 5);
// a: [ 4, 5, 1, 2, 3 ],修改了原数组
// b: 5,返回修改后的数组的长度

2.6 slice

  • 返回一个新的数组,包含从 startend (不包括该元素)的 arrayObject 中的元素。该方法不会修改原数组
1
2
3
4
5
6
7
8
9
var a = [1, 2, 3, 4, 5];
var b = a.slice(2);
// a: [1, 2, 3, 4, 5],不修改原数组
// b: [3, 4, 5],返回新数组

var c = [1, 2, 3, 4, 5];
var d = c.slice(2, -1);
// c: [1, 2, 3, 4, 5],不修改原数组
// d: [3, 4],返回新数组

2.7 splice

  • 可删除从 index 处开始的零个或多个元素,并且用参数列表中声明的一个或多个值来替换那些被删除的元素。如果从 arrayObject 中删除了元素,则返回的是含有被删除的元素的数组。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
var a = [1, 2, 3, 4, 5];
var b = a.splice(1, 1);
// a: [1, 3, 4, 5],修改了原数组
// b: [2],返回新数组

var c = [1, 2, 3, 4, 5];
var d = c.splice(-1, 1);
// c: [1, 2, 3, 4],修改了原数组
// d: [5],返回新数组

var e = [1, 2, 3, 4, 5];
var f = e.splice(1, 1, 6, 7);
// e: [ 1, 6, 7, 3, 4, 5 ],修改了原数组
// f: [2],返回新数组

var g = [1, 2, 3, 4, 5];
var h = g.splice(1, 0, 8);
// g: [ 1, 8, 2, 3, 4, 5 ],修改了原数组
// h: [],没有删除值,返回空数组

2.8 sort

  • 无参数时,将按字母顺序对数组中的元素进行排序。参数为比较函数时,如果要交换prevnext的值,返回大于0的值
1
2
3
4
5
6
var a = [1, 10, 8, 6, 9];
var b = a.sort(function (prev, next) {
return prev - next;
});
// a: [1, 6, 8, 9, 10],修改了原数组
// b: [1, 6, 8, 9, 10],返回修改后的数组

2.9 reverse

  • 用于颠倒数组中元素的顺序。会改变原数组
1
2
3
4
var a = [1, 2, 3];
var b = a.reverse();
// a: [3, 2, 1],修改了原数组
// b: [3, 2, 1],返回修改后的数组

2.10 map

有返回值,返回一个新的数组,每个元素为调用func的结果

1
2
3
4
5
6
let list = [1, 2, 3, 4, 5];
let other = list.map((d, i) => {
return d * 2;
});
console.log(other);
// print: [2, 4, 6, 8, 10]

2.11 forEach

  • 数组的每个元素执行一次提供的函数。一般来说不修改原数组,但也可以通过处理函数修改原数组。该方法很灵活,可类比for...of
  • 没有返回值,只针对每个元素调用func
  • 优点:代码简介。
  • 缺点:无法使用breakreturn等终止循环
  • value 当前操作的数组元素
  • 当前操作元素的数组索引
  • array 当前数组的引用
1
2
3
4
5
6
let list = [1, 2, 3, 4, 5];
list.forEach((d, i) => {
this.push(d * 2);
});
console.log(other);
// print: [2, 4, 6, 8, 10]

2.12 find

  • 返回数组中第一个满足测试条件(返回true)的元素。如果不存在这样的元素,返回undefinedfindIndex类似,只不过返回的是第一个满足测试条件的元素的index
1
2
3
4
5
6
var a = [1, 2, 3];
var b = a.find((curVal) => curVal === 1);
var c = a.find((curVal) => curVal === 4);
// a: [1, 2, 3],不修改原数组
// b: 1
// c: undefined

2.13 filter

  • 返回数组中所有满足测试条件(返回true)的元素组成的数组。如果不存在这样的元素,返回[]
1
2
3
4
5
6
var a = [1, 2, 3];
var b = a.filter((curVal) => curVal > 1);
var c = a.filter((curVal) => curVal > 3);
// a: [1, 2, 3],不修改原数组
// b: [2, 3]
// c: []

2.14 reduce和reduceRight

.reduce从左到右而.reduceRight从右到左循环遍历数组,每次调用接收目前为止的部分结果和当前遍历的值

  • 两种方法都有如下典型用法:.reduce(callback(previousValue, currentValue, index, array), initialValue)
  • previousValue是最后被调用的回调函数的返回值,initialValue是开始时previousValue被初始化的值。currentValue
  • 是当前被遍历的元素值,index是当前元素在数组中的索引值。array是对调用.reduce数组的简单引用
1
2
3
4
5
6
7
8
Array.prototype.sum = function () {
return this.reduce(function (partial, value) {
return partial + value
}, 0)
};

[3,4,5,6,10].sum()
// <- 28

可以使用.reduce作为对象的字符串生成器

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
function concat (input) {
return input.reduce(function (partial, value) {
if (partial) {
partial += ', '
}
return partial + value
}, '')
}

concat([
{ name: 'George' },
{ name: 'Sam' },
{ name: 'Pear' }
])
// <- 'George, Sam, Pear'

2.15 some

返回一个boolean,判断是否有元素符合func条件,如果有一个元素符合func条件,则循环会终止

1
2
3
4
5
6
7
let list = [1, 2, 3, 4, 5];
list.some((d, i) => {
console.log(d, i);
return d > 3;
});
// print: 1,0 2,1 3,2 4,3
// return false

2.16 every

返回一个boolean,判断每个元素是否符合func条件,有一个元素不满足func条件,则循环终止,返回false

1
2
3
4
5
6
7
let list = [1, 2, 3, 4, 5];
list.every((d, i) => {
console.log(d, i);
return d < 3;
});
// print: 1,0 2,1 3,2
// return false

三、Object

3.1 for in

for-in循环实际是为循环”enumerable“对象而设计的,for in也可以循环数组,但是不推荐这样使用,for–in是用来循环带有字符串key的对象的方法

1
2
3
4
5
var obj = {a:1, b:2, c:3};
for (var prop in obj) {
console.log("obj." + prop + " = " + obj[prop]);
}
// print: "obj.a = 1" "obj.b = 2" "obj.c = 3"

3.2 for of

for ofES6提供,具有iterator接口,就可以用for of循环遍历它的成员

  • for of循环可以使用的范围包括数组、SetMap结构、某些类似数组的对象(比如arguments对象、dom nodeList对象)、后文的Generator对象,以及字符串

3.2.1 entries

entries() 返回一个遍历器对象,用来遍历[键名, 键值]组成的数组。对于数组,键名就是索引值;对于Set,键名与键值相同。Map结构的iterator接口,默认就是调用entries方法

3.2.2 keys

  • keys() 返回一个遍历器对象,用来遍历所有的键名。

3.2.3 values

  • values()返回一个遍历器对象,用来遍历所有的键值。

这三个方法调用后生成的遍历器对象,所遍历的都是计算生成的数据结构

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
// 遍历数组
let list = [1, 2, 3, 4, 5];
for (let e of list) {
console.log(e);
}
// print: 1 2 3 4 5

// 遍历对象
obj = {a:1, b:2, c:3};
for (let key of Object.keys(obj)) {
console.log(key, obj[key]);
}
// print: a 1 b 2 c 3
//说明:对于普通的对象,for...in循环可以遍历键名,for...of循环会报错。
//一种解决方法是,使用Object.keys方法将对象的键名生成一个数组,然后遍历这个数组。

// entries
let arr = ['a', 'b', 'c'];
for (let pair of arr.entries()) {
console.log(pair);
}
// [0, 'a']
// [1, 'b']
// [2, 'c']

转载请保持原始链接

原始链接: https://ru23.com/note/1196ec8b.html