版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/q95548854/article/details/79084209
七、内置对象扩展
1. 模板字符串
// 正常情况下不允许换行
let html1 = '<html><head></head><body><p>今天的天气很好!</p><div>适合敲代码!</div></body></html>';
// 模板字符串(esc下面的键``-注意输入法调成英文)
let str = '适合敲代码!';
let className = 'test';
let html = `<html>
<head></head>
<body>
<p>今天的天气很好!</p>
<div class="${className}">${str}</div>
</body>
</html>`;
console.log(html);
2. 数组的扩展
// Array.from -- 将两类对象转为真正的数组:
(1).类数组的对象( array-like object )
(2).可遍历( iterable )的对象(包括 ES6 新增的数据结构 Set 和Map )
let allLis = document.querySelectorAll('li'); // 取到所有的li
console.log(allLis); // NodeList(6)--伪数组 其中length属性是实的
console.log(Array.isArray(allLis)); // false
console.log(Array.from(allLis)); // (6) [li,li,li,li,li,li]
console.log(Array.isArray(Array.from(allLis))); // true
// Array.of -- 将一组值,转换为数组。
·Array.of总是返回参数值组成的数组。如果没有参数,就返回一个空数组。
console.log(Array.of(1, 2, 3, 4));
console.log(Array.of('张三', '李四', '王五'));
3. 对象的扩展
// 当key 和 value是一样的,写一个就够了
let name = '张三';
let age = 18;
let person = {
// "name": name,
// "age": age
name,
age
};
console.log(obj);
// Object.assign()--将多个对象合并给第一个对象,重复的会重新赋值
let obj1 = {name: '张三'};
let obj2 = {age: 18};
let obj3 = {name: '张三222', sex: '男'};
let obj = {};
Object.assign(obj, obj1, obj2, obj3);
console.log(obj); // {name: '张三222', age: 18, sex: '男'}
4. 延展操作符 -- [详情点击](https://zhuanlan.zhihu.com/p/26387033)
var students = ['Abby','Andy'];
var otherStudents = ['Jane','Tom'];
students.push(...otherStudents);
console.log(students); // Abby Andy Jane Tom
// 数组去重
let myArr = [1, 2, 10, '张三', 20, 2, 1];
console.log([...new Set(myArr)]);