JavaScript的一些基本方法总结

最近开始学习JavaScript，以此文章来对学习中的一些方法进行总结，方便以后查阅。

字符串的相关方法

方法名说明toUpperCase()把一个字符串全部变成大写toLowerCase()把一个字符串全部变成小写indexOf()搜索指定字符串出现的位置substring()返回指定索引区间的子串

数组的相关方法

方法名说明indexOf()Array也可以通过indexOf()来搜索一个指定的元素的位置slice()截取Array的部分元素，然后返回一个新的Arraypush()向Array的末尾添加若干元素pop()把Array的最后一个元素删除掉unshift()往Array的头部添加若干元素shift()把Array的第一个元素删掉sort()对当前Array进行排序，直接修改当前Array的元素位置，直接调用时，按照默认顺序排序reverse()把整个Array的元素进行反转splice()修改Array的“万能方法”，可以从指定的索引开始删除若干元素，然后再从该位置添加若干元素concat()把当前的Array和另一个Array连接起来，没有修改当前Array,并返回一个新的Arrayjoin()把当前Array的每个元素都用指定的字符串连接起来，然后返回连接后的字符串

注意：如果有很多变量需要连接，用+号就比较麻烦。ES6新增了一种模板字符串，表示方法和上面的多行字符串一样，但是它会自动替换字符串中的变量。(反引号和${})

对象的相关方法

方法说明in来判断某个属性是否存在，包括继承得到的hasOwnProperty()判断本身属性是否存在，不包括继承得到的

Map,Set相关用法

Map：

操作代码实现创建Mapvar m = new Map([[‘Michael’, 95], [‘Bob’, 75], [‘Tracy’, 85]]);添加Mapm.set(‘Adam’, 67);删除Mapm.delete(‘Adam’);是否存在keym.has(‘Adam’);根据key获得valuem.get(‘Adam’);

Set： key不能重复

操作代码实现创建Setvar s = new Set([1, 2, 3, 3, ‘3’]);添加Sets.add(4)删除Sets.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