字符串的新增方法
includes 判断字符串中是否含有某些字符
（1）基本用法
console.log('abc'.includes('a')); // true
console.log('abc'.includes('ab')); //true
console.log('abc'.includes('bc')); //true
console.log('abc'.includes('ac')); // false
（2）参数
/*
第一个参数，必需，要查找的字符串。
第二个参数，可选，设置从那个位置开始查找，默认为 0
*/
console.log('abc'.includes('a')); //true
console.log('abc'.includes('a', 0)); //true
console.log('abc'.includes('a', 1)); // false
（3）应用 拼接url地址
let url = 'https://www.imooc.com/course/list?';
const addURLParam = (url, name, value) => {
url += url.includes('?') ? '&' : '?';
url += `${name}=${value}`;
return url;
};
url = addURLParam(url, 'c', 'fe');
console.log(url);
url = addURLParam(url, 'sort', 'pop');
console.log(url);
padStart和padEnd 补全字符串
（1）基本用法
console.log('x'.padStart(5, 'ab')); //ababx
console.log('x'.padEnd(5, 'ab')); //xabab
console.log('x'.padEnd(4, 'ab')); // xaba
（2）注意事项
原字符串的长度，等于或大于最大长度，不会消减原字符串，字符串补全不生效，返回原字符串
console.log('xxx'.padStart(2, 'ab')); // xxx
console.log('xxx'.padEnd(2, 'ab')); // xxx
用来补全的字符串与原字符串长度之和超过了最大长度，截去超出位数的补全字符串，原字符串不动
console.log('abc'.padStart(10, '0123456789')); //0123456abc
console.log('abc'.padEnd(10, '0123456789')); // abc0123456
如果省略第二个参数，默认使用空格补全长度
console.log('x'.padStart(4)); // x
console.log('x'.padEnd(4)); // x
（3）应用
padStart 显示日期
// 2020-10-10
console.log('10'.padStart(2, 0)); // 10
console.log('1'.padStart(2, 0)); // 01
trimStart和trimEnd方法，清除字符串的首或尾空格，中间的空格不会清除
（1）基本用法
const s = ' a b c ';
console.log(s.trimStart());
console.log(s.trimLeft());
console.log(s.trimEnd());
console.log(s.trimRight());
（2）应用: 提交数据时，去掉首尾空格
数组的新增方法
includes 判断数组中是否含有某个成员
（1）基本用法
console.log([1, 2, 3].includes('2')); // false
console.log([1, 2, 3].includes(2)); // true
（2）参数
/*
第一个参数，必须，需要查找的元素值。
第二个参数，可选，从该索引处开始查找 searchElement。如果为负值，则按升序从 array.length + fromIndex 的索引开始搜索。默认为 0。
*/
console.log([1, 2, 3].includes(2, 2)); // false
console.log([1, 2, 3].includes(2, -2)); //true
console.log([1, 2, 3].includes(3)); // false
（3）注意事项：基本遵循严格相等（===）,但是对于 NaN 的判断与 === 不同，includes 认为 NaN === NaN
console.log(NaN === NaN); // false
console.log([1, 2, NaN].includes(NaN)); // true
（4）应用 数组去重
const arr = [];
for (const item of [1, 2, 1]) {
if (!arr.includes(item)) {
arr.push(item);
}
}
console.log(arr);
Array.from 将其他数据类型转换成数组
（1）基本用法
console.log(Array.from('str')); // ["s", "t", "r"]
（2）可以通过 Array.from() 转换成数组
所有可遍历的 数组、字符串、Set、Map、NodeList、arguments
console.log(Array.from(new Set([1, 2, 1]))); // [1, 2]
// 等价于
console.log([...new Set([1, 2, 1])]);
拥有 length 属性的任意对象
const obj = {
'0': 'a',
'1': 'b',
name: 'Alex',
length: 3
};
console.log(Array.from(obj));
（3）参数
// 3.第二个参数 : 数组中每个元素要调用的函数
// 作用类似于数组的 map 方法，用来对每个元素进行处理，将处理后的值放入返回的数组
console.log(
[1, 2].map(value => {
return value * 2;
})
);
console.log(Array.from('12', value => value * 2));
console.log(Array.from('12').map(value => value * 2));
// 4.第三个参数 映射函数(mapFunction)中的 this 对象
Array.from(
'12',
value => {
console.log(this);
},
document
);
Array.from(
'12',
function () {
console.log(this);
},
document
);
find()：找到满足条件的一个立即返回值
findIndex()：找到满足条件的一个，立即返回其索引
（1）参数
参数 描述
function(currentValue, index,arr) 必须。数组每个元素需要执行的函数。
1、currentValue 必需，当前元素。
2、index，可选，当前元素的索引。
3、arr，可选。当前元素所属的数组对象
thisValue 可选。 传递给函数的值一般用 "this" 值。如果这个参数为空， "undefined" 会传递给 "this" 值
（2）代码示例
console.log(
[1, 5, 10, 15].find((value, index, arr) => {
// console.log(value, index, arr);
console.log(this);
return value > 9;
}, document)
);
[1, 5, 10, 15].find(function(value, index, arr) {
// console.log(value, index, arr);
console.log(this);
return value > 9;
}, document);
console.log(
[1, 5, 10, 15].findIndex((value, index, arr) => {
// console.log(value, index, arr);
return value > 9;
}, document)
);
（3）应用 从获取到数据中筛选数据
const students = [
{
name: '张三',
sex: '男',
age: 16
},
{
name: '李四',
sex: '女',
age: 22
},
{
name: '王二麻子',
sex: '男',
age: 32
}
];
console.log(students.find(value => value.sex === '女'));
console.log(students.findIndex(value => value.sex === '女'));
3、对象的新增方法
Object.assign 合并对象，相当于将后面的对象合并到第一个对象中
（1）基本使用
// Object.assign(目标对象, 源对象1,源对象2,...): 目标对象
const apple = {
color: '红色',
shape: '圆形',
taste: '甜'
};
const pen = {
color: '黑色',
shape: '圆柱形',
use: '写字'
};
console.log(Object.assign(apple, pen));
// console.log(Object.assign(apple, pen) === apple); true
（2）注意事项
基本数据类型作为源对象 与对象的展开类似，先转换成对象，再合并
console.log(Object.assign({}, undefined));
console.log(Object.assign({}, null));
console.log(Object.assign({}, 1));
console.log(Object.assign({}, true));
console.log(Object.assign({}, 'str'));
同名属性的替换 , 后面的直接覆盖前面的
const apple = {
color: ['红色', '黄色'],
shape: '圆形',
taste: '甜'
};
const pen = {
color: ['黑色', '银色'],
shape: '圆柱形',
use: '写字'
};
console.log(Object.assign({}, apple, pen));
（3）应用 合并默认参数和用户参数
const logUser = userOptions => {
const DEFAULTS = {
username: 'ZhangSan',
age: 0,
sex: 'male'
};
const options = Object.assign({}, DEFAULTS, userOptions);
// const options = Object.assign({}, DEFAULTS, undefined);
console.log(options);
};
logUser();
// logUser({});
// logUser({ username: 'Alex' });
Object.keys 获取对象中属性名的集合
Object.value 获取对象中属性值值的集合
Object.entries 获取对象中属性和值的集合
（1）基本用户
const person = {
name: 'Alex',
age: 18
};
console.log(Object.keys(person));
console.log(Object.values(person));
console.log(Object.entries(person));
（2）与数组类似方法的区别
数组的 keys()、values()、entries() 等方法是实例方法，返回的都是 Iterator
对象的 Object.keys()、Object.values()、Object.entries() 等方法是构造函数方法，返回的是数组
const person = {
name: 'Alex',
age: 18
};
console.log([1, 2].keys());
console.log([1, 2].values());
console.log([1, 2].entries());
console.log(person.keys);
（2）使用 for...of 循环遍历对象
for (const key of Object.keys(person)) {
console.log(key);
}
for (const value of Object.values(person)) {
console.log(value);
}
for (const entries of Object.entries(person)) {
console.log(entries);
}