一、字符串
1、slice
slice(start,end)
提取字符串的一部分,并返回一个新字符串
'JIRONGLIANG'.slice(2,3) // R
2、substr
substr(start,length)
提取字符串的一部分,并返回一个新字符串
'JIRONGLIANG'.substr(2,4) // RONG
3、split
split(separator, limit)
按照分隔符讲字符串拆分为数组
'J,I,R,O,N,G,L,I,A,N,G'.split(',',3) // ['J', 'I', 'R']
4、replace
replace(regexp|substr,newSubstr|function)
用来替换字符串中的子串
'JIRONGLIANG'.replace('LIANG','HAHA') // JIRONGHAHA
"JIRONGLIANG".replace(/N/g,(match)=>{
console.log(match) // 两次N
return "H"
}) // JIROHGLIAHG
5、chartAt
chartAt(index)
返回指定位置的字符
'JIRONGLIANG'.charAt(0) // J
6、indexOf
`indexOf('LI') 方法返回字符串中指定文本首次出现的索引(如果没有找到该子字符串,则返回 -1)
'JIRONGLIANG'.indexOf('JI') // 0
7、includes
includes('LI')
返回布尔值,表示是否找到了参数字符串
'JIRONGLIANG'.includes('LI') // true
8、遍历器接口
ES6 为字符串添加了遍历器接口,使得字符串可以由 for…of 循环遍历
for (let codePoint of 'foo') {
console.log(codePoint)
}
// "f"
// "o"
// "o"
二、数组(容易搞混的方法)
1、slice
slice(start,end)
- 返回创建新数组。
- 它不会从源数组中删除任何元素。
["Banana", "Orange", "Lemon", "Apple", "Mango"].slice(1)
// ['Orange', 'Lemon', 'Apple', 'Mango']
2、splice
splice(位置 , 删除几个 , 其余参数添加什么就写几个)。
- 会改变元素组
- 返回被删除的元素
["Banana", "Orange", "Apple", "Mango"].splice(2, 2, "Lemon", "Kiwi");
// ['Banana', 'Orange', 'Lemon', 'Kiwi']
3、join
join(seperator)
把数组转成字符串。
['Banana', 'Orange', 'Lemon', 'Kiwi'].join('')
// 'BananaOrangeLemonKiwi'
4、Arrary.from
将伪数组转化成真数组
// NodeList 对象
let ps = document.querySelectorAll('p')
Array.from(ps).forEach(function (p) { // 只有转换为真正的数组才能使用数组方法
console.log(p)
})
// arguments对象
function foo () {
var args = Array.from(arguments)
// ...
}
5、find() 和 findIndex()
找出数组中第一个符合条件的参数
// 找出数组中第一个大于 9 的成员
// 回调函数可接受 3 个参数:当前的值,当前的位置,原数组
[1, 5, 10, 15].find(function (value, index, arr) {
return value > 9
}) // 10
[1, 5, 10, 15].findIndex(function (value, index, arr) {
return value > 9
}) // 2
// 这两个方法可以发现 NaN,弥补了数组的 IndexOf 方法的不足
[NaN].indexOf(NaN) // -1
[NaN].findIndex(y => Object.is(NaN, y)) // 0
6、flat()
flat()将数组扁平化为一维数组
var arr1 = [1, 2, [3, 4]];
arr1.flat();
// [1, 2, 3, 4]
var arr2 = [1, 2, [3, 4, [5, 6]]];
arr2.flat();
// [1, 2, 3, 4, [5, 6]]
var arr3 = [1, 2, [3, 4, [5, 6]]];
arr3.flat(2);
// [1, 2, 3, 4, 5, 6]
//使用 Infinity 作为深度,展开任意深度的嵌套数组
arr3.flat(Infinity);
// [1, 2, 3, 4, 5, 6]
7、迭代器(数组和字符串都有 对象没有)
三、对象
1、 Object.keys(对象)
得到所有的健
var obj = {a:'html',b:'css',c:'js'}
var keyValue = Object.keys(obj)
console.log(keyValue) //['a','b','c']
2、 Object.values(对象)
得到所有的值
let arr = {name:'张三',age:{a:'list1',b:'list2'}}
var keyValue = Object.keys(arr).map(key => arr[key])
console.log(keyValue); //['张三',{a:'list1',b:'list2'}]
3、Object.entries(obj)
const school = {
name: '张三',
age: 21,
subject: ['数据结构','安卓','数据库']
}
console.log(Object.entries(school));
// [['name', '张三'],['age', 21],['subject', Array(3)]]
四、Map
可以存储任意类型的健值对
Map | 方法 描述 |
---|---|
Map() | 构造函数 |
set(key, value) | 设置 key 所对应的键值,然后返回整个 Map 结构。如果 key 已经有值,则键值被更新,否则新生成该键 |
get(key) | 读取 key 对应的键值,若未找到 key 则返回 undefined |
has(key) 返回一个布尔值 | 表示某个键是否存在于 Map 结构中 |
delete(key) | 删除某个键,返回 true;删除失败返回 false |
clear() | 清除所有成员,没有返回值 |
values() | 返回键值的遍历器 |
keys() | 返回键名的遍历器 |
entries() | 返回键值对的遍历器 |
forEach() | 使用回调函数遍历每个成员,用法:map.forEach(function (value, key, map){ }) |
size | 这个是属性 返回元素计数。 |
五、Set
set类似于数组 set中的值是唯一的
Set方法 | 描述 |
---|---|
Set() | 构造函数,可以接受一个数组,或者具有 iterable 接口的其他数据结构作为参数 |
add(value) | 添加某个值,返回 Set 结构本身 |
delete(value) | 删除某个值,返回布尔值,表示是否删除成功 |
has(value) | 返回布尔值,表示参数是否为 Set 的成员 |
clear() | 清除所有成员,没有返回值 |
keys() | 返回键名的遍历器,用法:for (let item of set.keys()) |
values() | 返回键值的遍历器 |
entries() | 返回键值对的遍历器 |
forEach() | 使用回调函数遍历每个成员 |
size | 这个是属性 返回元素计数。 |