1.关于解构
在数组的解构中,如果我只想要 第三个,怎么办?
很简单,我甚至还能够给这个设置默认值
const arr = [1, 2, 3, 5, 6, 7, 8]
const [,,third = 'third'] = arr
如果我想要一个对象除了 某一个 字段之外的新对象
const obj = {
want1: true,
want2: true,
want3: true,
dont: false
}
const {
dont,
... obj2
} = obj;
// 这样,obj2 就完美地满足了自己的要求
2.模板字符串
在之前,写模板语法的时候,是使用 正则表达式 来匹配的,下面来看一下模板方法模式
// 模板语法中的格式化字符串方法
var tpl = {
formateString: function (str, data) {
return str.replace(/\{%(\w+)%\}/g, function (match, key) {
return data[key] ? data[key] : '';
})
},
formateArr: function (str, dataArr) {
var dom = '';
var _this = this;
if (!dataArr) {
return ''
}
dataArr.map(function (data) {
dom += _this.formateString(str, data);
})
return dom;
}
};
// 模板语法中的 样式模板
var template = ['<a href="{%href%}"><h2>{%name%}</h2></a>',
'<div>{%content%}</div>'].join('');
var tempdata = {
name: '标题',
content: '内容',
href: 'https://www.baidu.com'
}
var result = tpl.formateString(template, tempdata);
可以看到,最后 result 的输出结果就是
<a href="https://www.baidu.com"><h2>标题</h2></a><div>内容</div>
那么如果加上 es6 中的模板字符串,就可以丢掉 那一大堆的格式化字符串方法了
var temp = (obj) => `<a href="${obj.href}"><h2>${obj.name}</h2></a>''<div>${obj.content}</div>'`
temp({
name: '标题',
content: '内容',
href: 'https://www.baidu.com'
}})
3.对象的比较
Object.is(-0, 0) // false
Object.is(NaN, NaN) // true
4.Proxy & Reflect 与 Object 对象属性的比较
5.异步迭代器
6.字符串
有时候会遇到这样一个需求,要在 小于 10 的情况下,在前面增加一个 0
// 通常的方法 是 判断 数字的大小,然后增加,或者转化为字符串之后,判断字符串长度
if (`num`.length === 1) {
num = `0${num}`
}
但是现在有了更好的方法
num = `${num}`.padStart(2, 0)
对应于padStart, 还存在 padEnd 方法
7.ajax 请求
作为 面试中的必考题,以前的写法是这样的
function Ajax(url, callback) {
var xhr = new XMLHttpRequest()
xhr.open('Get', url)
xhr.onreadystatechange = function() {
if(xhr.readyStatus === 4 && xhr.status === 200) {
callback(xhr.responseText)
}
}
xhr.send()
}
但是现在 已经 可以摒弃 readyStaus 的写法了,转而使用 onload
function ajax (url) {
return new Promise(function(resolve, reject) {
var xhr = new XHRHttpRequest()
xhr.open('GET', url)
xhr.responseType = 'json'
xhr.onload = function() {
if (this.status === 200) {
resolve(this.response)
} else {
reject(new Error())
}
}
xhr.send()
})
}
8. 在 vs code 中打开chrome 中的控制台
这个时候高呼 万万没想到!没想到 vs code 就是一个 浏览器!!!!!!