JS經常使用操做方法圖表

截取字符串方法

方法名	參數	返回值	例子
String.prototype.substr()	(indexStart, length) 均可爲負數，length爲負數時自動轉爲0，length不傳默認截取剩下的全部	新字符串	'JavaScript'.substr(4, 6) // "Script"
String.prototype.substring()	(indexStart, indexEnd) 負數會轉爲0	新字符串	'JavaScript'.substring(-4) // "JavaScript"
String.prototype.slice()	(indexStart, indexEnd) 負數會轉爲與長度相加以後的數	新字符串	'JavaScript'.slice(-4) // "ript"

三者區別：

• 他們三者第二個參數都是可選的，若是隻傳一個正常下標的數字，都是返回從這個下標開始到字符串結束的這一段字符串，他們都不會改變原字符串
• substr截取的是從indexStart下標開始長度爲length的字符串，substring和slice兩個參數都是開始和結束的下標，而且都不包含結束下標的字符
• substring和slice參數若是爲負數，substring會轉爲0，而slice會轉爲與字符串的長度相加以後的新下標

截取數組方法

方法名	參數	返回值	例子
Array.prototype.slice()	(indexStart, indexEnd) 若是slice方法的參數是負數，則表示倒數計算的位置	新數組	['a', 'b', 'c'].slice(1, 2) //['b']
Array.prototype.splice()	(indexStart, count, addElement1, addElement2,...) 若是隻傳一個參數就至關於把原數組拆分爲截斷了	被刪除的元素,改變原數組	['a', 'b', 'c', 'd', 'e', 'f'].splice(4, 2); // ["e", "f"]

二者區別：

• 只傳一個正常下標，都能獲得從這個下標開始到數組結束的一個新數組
• slice不會改變原數組，返回值是新數組，splice會改變，返回值是被刪除的元素
• slice可以刪除原數組中的某些元素，並能在刪除的位置添加新成員

tips:

• slice方法還有一個重要的應用，能夠將類數組對象轉爲數組
  Array.prototype.slice.call({ 0: 'a', 1: 'b', length: 2 }) //['a', 'b']

• Array.from也能夠作到

  Array.from({ 0: 'a', 1: 'b', length: 2 })  //['a', 'b']

經常使用數組方法

var arr = [1, 2, 3];

let arr2 = ['今每天氣不錯', '早上好']
arr2 = arr2.map(s => s.split(''))
// [ [ '今', '天', '天', '氣', '不', '錯' ], [ '早', '上', '好' ] ]

方法名	參數和說明	返回值	例子
Array.isArray()	arr	Boolean	Array.isArray(arr) // true
Array.prototype.valueOf()	無	數組自己	arr.valueOf() // [1, 2, 3]
Array.prototype.toString()	無	數組的字符串形式	arr.toString() // "1,2,3"
Array.prototype.push()	elementN，尾部插入值	新的length	arr.push(7) // 4
Array.prototype.pop()	無	刪除的元素,刪除最後一個元素	arr.pop() // 3
Array.prototype.shift()	無	刪除的元素,刪除第一個元素	arr.shift() // 1
Array.prototype.unshift()	elementN，首部插入值	新的length	arr.shift(7) // 4
Array.prototype.join()	separator,默認爲'','	字符串	arr.join('
Array.prototype.concat()	array,object,elementN	新數組（淺拷貝）	arr.concat([7]) // [1, 2, 3, 7]
Array.prototype.reverse()	無	顛倒排序以後的原數組	arr.reverse() // [3, 2, 1]
Array.prototype.sort()	無，默認按字典排序，或者傳入一個函數	從新排序以後的原數組	arr.sort() // [1, 2, 3]
Array.prototype.map()	回調函數，把每次的執行結果從新組成一個數組	新數組	arr.map(function (n) { return n + 1; }); //[2,3,4]
Array.prototype.forEach()	回調函數，操做原數組	不返回值，改變原數組	arr.forEach(function (n) { console.log(n) }); //1 2 3
Array.prototype.filter()	回調函數，根據篩選項條件獲得新數組	新數組	arr.filter(function (item) { return (item > 2) }); //[3]
Array.prototype.some()	回調函數，某一個元素知足條件即返回true，不然返回false	Boolean	arr.some(function (item) { return item > 2 }); //true
Array.prototype.every()	回調函數，全部元素知足條件即返回true，不然返回false	Boolean	arr.every(function (item) { return item > 2 }); //false
Array.prototype.reduce()	(func, 初始值)，從左到右	執行以後的返回值	arr.reduce(function (prev, cur) { return prev+cur }, 10); //16
Array.prototype.reduceRight()	(func, 初始值)，從右到左	執行以後的返回值	arr.reduceRight(function (prev, cur) { return prev+cur }, 10); //16
Array.prototype.indexOf()	(searchElement,fromIndex)第二個參數是開始查找的位置	存在返回索引值，沒有返回-1	arr.indexOf(2); //1
Array.prototype.lastIndexOf()	(searchElement,fromIndex)第二個參數是開始查找的位置，從右到左	存在返回索引值，沒有返回-1	arr.lastIndexOf(3); //2
ES6
Array.from()	相似數組的對象和可遍歷的對象	真正的數組	Array.from({'0': 'a','1': 'b','2': 'c', length: 3}); // ["a", "b", "c"]
Array.of()	將一組值轉爲數組，爲了彌補Array()參數不一樣的行爲差別	數組	Array.of(1,2,3); // [1, 2, 3]
Array.prototype.includes()	(searchElement,fromIndex)，fromIndex可選，即是開始查找的位置	Boolean	[1, 2, 3].includes(2); ; // true
Array.prototype.flat()	depth,可選參數，默認1，將嵌套數組拉平變成一維數組	新數組	[1, 2, [3, 4, [5, 6]]].flat(2); // [1, 2, 3, 4, 5, 6]
Array.prototype.flatMap()	callback，	新數組	arr2.flatMap(s => s.split('')); // ["今", "天", "天", "氣", "不", "錯", "早", "上", "好"]
Array.prototype.copyWithin()	(target, start, end) 將start和end之間的元素複製覆蓋target指定的位置，end指定的元素不會複製	數組	[1,2,3,4].copyWithin(1, 2, 3); // [1, 3, 3, 4]
Array.prototype.find()	(callback, thisArg)	返回符合條件的第一個值,不然unfettered	[1,2,3,4,5].find(function(item){ return item>2 }); // 3
Array.prototype.findIndex()	(callback, thisArg)	返回符合條件的第一個值的下標,不然unfettered	[1,2,3,4,5].findIndex(function(item){ return item>2 }); // 2
Array.prototype.fill()	(value, start, end )，將指定的位置填充爲value，若是不指定就所有填充	修改後的數組	[1,2,3,4].fill(7, 2, 3); // [1, 2, 7, 4]
Array.prototype.entries()	無	可遍歷的Iterator對象,[key, value]	[1,2,3,4].entries(); // 可被for of遍歷
Array.prototype.keys()	無	可遍歷的Iterator對象, key	[1,2,3,4].keys(); // 可被for of遍歷
Array.prototype.values()	無	可遍歷的Iterator對象, value	[1,2,3,4].values(); // 可被for of遍歷

字符串處理方法

方法名	參數和說明	返回值	例子
String.fromCharCode()	一個或多個數值，表明Unicode 碼點	字符串	String.fromCharCode(104, 101, 108, 108, 111) // 'hello'
String.prototype.charAt()	index,下標	字符串	new String('abc').charAt(1) //b
String.prototype.charCodeAt()	index,下標	Unicode 碼點（十進制表示）	'hello'.charCodeAt(1) // 101
String.prototype.concat()	string2...stringN	字符串	'hello'.concat('world', 'haha') // "helloworldhaha"
String.prototype.indexOf()	searchValue,fromIndex	第一次出現的索引,沒找到就-1	'hello'.indexOf('e') // 1
String.prototype.lastIndexOf()	searchValue,fromIndex	第一次出現的索引	'wanwan'.lastIndexOf('a'); //4 'wanwan'.lastIndexOf('a', 3) //1
String.prototype.trim()	無，刪除字符串兩端空白字符串	新字符串	' wan '.trim() // 'wan'
String.prototype.toLowerCase()	無，小寫	新字符串	'wanCheng'.toLowerCase() // 'wancheng'
String.prototype.toUpperCase()	無，大寫	新字符串	'wanCheng'.toUpperCase() // 'WANCHENG'
String.prototype.match()	regexp	array	'wancheng'.match('wan') // ['wan'] 'wancheng'.match(/\w/) // ['w']
String.prototype.search()	regexp	首次匹配成功的索引，不成功爲-1	'wancheng'.search('c') //
String.prototype.replace()	regexp	新字符串	'wan cheng'.replace(/wan/i, 'san') // "san cheng"
ES6
String.prototype.includes()	searchString,position(可選)	boolean	'hello world'.includes('hello') // true
String.prototype.startsWith()	searchString,position(可選),是不是以給定的字符串開頭	boolean	'hello world'.startsWith('h') // true
String.prototype.endsWith()	searchString,position(可選),是不是以給定的字符串結尾	boolean	'hello worlds'.endsWith('s') // true
String.prototype.repeat()	count（[0, +∞]）	新字符串	'wan'.repeat(2) // 'wanwan'
String.prototype.padStart()	targetLength,padString (可選)	原字符串	'abc'.padStart(7, 'sd') // "sdsdabc"
String.prototype.padEnd()	targetLength,padString (可選)	原字符串	'abc'.padEnd(7, 'sd') // "abcsdsd"