最近开始学习JavaScript,以此文章来对学习中的一些方法进行总结,方便以后查阅。
字符串的相关方法
方法名 | 说明 |
---|---|
toUpperCase() | 把一个字符串全部变成大写 |
toLowerCase() | 把一个字符串全部变成小写 |
indexOf() | 搜索指定字符串出现的位置 |
substring() | 返回指定索引区间的子串 |
数组的相关方法
方法名 | 说明 |
---|---|
indexOf() | Array也可以通过indexOf()来搜索一个指定的元素的位置 |
slice() | 截取Array的部分元素,然后返回一个新的Array |
push() | 向Array的末尾添加若干元素 |
pop() | 把Array的最后一个元素删除掉 |
unshift() | 往Array的头部添加若干元素 |
shift() | 把Array的第一个元素删掉 |
sort() | 对当前Array进行排序,直接修改当前Array的元素位置,直接调用时,按照默认顺序排序 |
reverse() | 把整个Array的元素进行反转 |
splice() | 修改Array的“万能方法”,可以从指定的索引开始删除若干元素,然后再从该位置添加若干元素 |
concat() | 把当前的Array和另一个Array连接起来,没有修改当前Array,并返回一个新的Array |
join() | 把当前Array的每个元素都用指定的字符串连接起来,然后返回连接后的字符串 |
注意:如果有很多变量需要连接,用+号就比较麻烦。ES6新增了一种模板字符串,表示方法和上面的多行字符串一样,但是它会自动替换字符串中的变量。(反引号和${})
对象的相关方法
方法 | 说明 |
---|---|
in | 来判断某个属性是否存在,包括继承得到的 |
hasOwnProperty() | 判断本身属性是否存在,不包括继承得到的 |
Map,Set相关用法
Map:
操作 | 代码实现 |
---|---|
创建Map | var m = new Map([[‘Michael’, 95], [‘Bob’, 75], [‘Tracy’, 85]]); |
添加Map | m.set(‘Adam’, 67); |
删除Map | m.delete(‘Adam’); |
是否存在key | m.has(‘Adam’); |
根据key获得value | m.get(‘Adam’); |
Set:
key不能重复
操作 | 代码实现 |
---|---|
创建Set | var s = new Set([1, 2, 3, 3, ‘3’]); |
添加Set | s.add(4) |
删除Set | s.delete(3); |
iterable
for…in循环:对对象的属性名称进行遍历。
var a = ['A', 'B', 'C'];
a.name = 'Hello';
for (var x in a) {
alert(x); // '0', '1', '2', 'name'
}
for…of循环:只循环集合本身的元素。
var a = ['A', 'B', 'C'];
a.name = 'Hello';
for (var x of a) {
alert(x); // 'A', 'B', 'C'
}
使用forEach方法:
var a = ['A', 'B', 'C'];
a.forEach(function (element, index, array) {
// element: 指向当前元素的值
// index: 指向当前索引
// array: 指向Array对象本身
alert(element);
});
函数相关方法
1.apply()和call():
apply():第一个参数为需要绑定的this变量,参数打包成Array作为第二个参数。
call():第一个参数为需要绑定的this变量,参数按顺序传入作为第二个参数。
例子:
Math.max.apply(null, [3, 5, 4]); // 5
Math.max.call(null, 3, 5, 4); // 5
2.map():传入参数是函数对象本身
定义:定义在JavaScript的Array中,我们调用Array的map()方法,传入我们自己的函数,就得到了一个新的Array。
例子:
function pow(x) {
return x * x;
}
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
arr.map(pow); // [1, 4, 9, 16, 25, 36, 49, 64, 81]
注意:关于使用map()方法把字符串转换为整数的坑:
'use strict';
var arr = ['1', '2', '3'];
var r;
r = arr.map(parseInt);
alert('[' + r[0] + ', ' + r[1] + ', ' + r[2] + ']');
运行结果显示:[1, NaN, NaN]
原因:
由于map()接收的回调函数可以有3个参数:callback(currentValue, index, array),通常我们仅需要第一个参数,而忽略了传入的后面两个参数。不幸的是,parseInt(string, radix)没有忽略第二个参数,导致实际执行的函数分别是:
parseInt(‘0’, 0); // 0, 按十进制转换
parseInt(‘1’, 1); // NaN, 没有一进制
parseInt(‘2’, 2); // NaN, 按二进制转换不允许出现2
可以改为r = arr.map(Number);,因为Number(value)函数仅接收一个参数;
或者使用如下代码解决parseInt()的转换问题:
var arr = ['1','2','3'];
var r = arr.map(function(val){
return parseInt(val);
});
console.log(r);
3.reduce():
定义:Array的reduce()把一个函数作用在这个Array的[x1, x2, x3…]上,这个函数必须接收两个参数,reduce()把结果继续和序列的下一个元素做累积计算。其效果就是:
[x1, x2, x3, x4].reduce(f) = f(f(f(x1, x2), x3), x4)
例子:
var arr = [1, 3, 5, 7, 9];
arr.reduce(function (x, y) {
return x + y;
}); // 25
4.filter():
定义:filter()把传入的函数依次作用于每个元素,然后根据返回值是true还是false决定保留还是丢弃该元素。通常我们仅使用第一个参数,表示Array的某个元素。回调函数还可以接收另外两个参数,表示元素的位置和数组本身。
例子:
var arr = ['A', 'B', 'C'];
var r = arr.filter(function (element, index, self) {
console.log(element); // 依次打印'A', 'B', 'C'
console.log(index); // 依次打印0, 1, 2
console.log(self); // self就是变量arr
return true;
});
5.sort():
定义:默认把所有元素先转换为String再排序,会直接对Array进行修改,它返回的结果仍是当前Array。
例子:
var arr = [10, 20, 1, 2];
arr.sort(function (x, y) {
if (x < y) {
return -1;
}
if (x > y) {
return 1;
}
return 0;
}); // [1, 2, 10, 20]
总结
总结一下,有这么几条规则需要遵守:
1.不要使用new Number()、new Boolean()、new String()创建包装对象;
2.用parseInt()或parseFloat()来转换任意类型到number;
用String()来转换任意类型到string,或者直接调用某个对象的toString()方法;
3.通常不必把任意类型转换为boolean再判断,因为可以直接写if (myVar) {…};
4.typeof操作符可以判断出number、boolean、string、function和undefined;
5.判断Array要使用Array.isArray(arr);
6.判断null请使用myVar === null;
7.判断某个全局变量是否存在用typeof window.myVar === ‘undefined’;
8.函数内部判断某个变量是否存在用typeof myVar === ‘undefined’。
参考:
廖雪峰的官方网站
https://segmentfault.com/a/1190000007402240