字符串
- 多行字符串
let str =`
Hi,
This is jirengu.com.
You can study frontend here.
`
- 字符串模板
let website = 'jirengucom'
let who = 'You'
let str = `Hi
This is ${website}.
${who} can study frontend here
`
數(shù)組
- 擴(kuò)展
var a = [1, 2]
console.log(...a) // 1, 2
var b = [...a, 3]
b // [1, 2, 3]
var c = b.concat([4, 5])
var d = [...b, 4, 5]
- 函數(shù)參數(shù)的擴(kuò)展
function sort(...arr){
console.log(arr.sort())
}
sort(3, 1, 5) //[1, 3, 5]
function max(arr){
return Math.max(...arr)
}
max([3, 4, 1]) // 4
- 類數(shù)組對象轉(zhuǎn)數(shù)組
let ps = document.querySelectorAll('p');
Array.from(ps).forEach(p=> {
console.log(p.innerText);
});
[...ps].forEach(p=>{console.log(p.innerText)});
函數(shù)
- 默認(rèn)值
function sayHi(name='jirengu') {
console.log(`hi, ${name}`)
}
sayHi()
sayHi('ruoyu')
function fetch(url, { body='', method = 'GET', headers = {} } = {}) {
console.log(method);
}
fetch('http://example.com')
以下兩種寫法的區(qū)別?
//ex1
function m1({x = 0, y = 0} = {}) {
return [x, y];
}
//ex2
function m2({x, y} = { x: 0, y: 0 }) {
return [x, y];
}
// 函數(shù)沒有參數(shù)的情況
m1() // [0, 0]
m2() // [0, 0]
// x 和 y 都有值的情況
m1({x: 3, y: 8}) // [3, 8]
m2({x: 3, y: 8}) // [3, 8]
// x 有值躏率，y 無值的情況
m1({x: 3}) // [3, 0]
m2({x: 3}) // [3, undefined]
// x 和 y 都無值的情況
m1({}) // [0, 0];
m2({}) // [undefined, undefined]
m1({z: 3}) // [0, 0]
m2({z: 3}) // [undefined, undefined]
ex1： 調(diào)用函數(shù)需要你傳遞一個對象，如果你沒傳對象就用默認(rèn)值對象{}，默認(rèn)值對象里面都是 undefined薇芝， 所以屬性使用初始值
ex2：參數(shù)需要是一個對象蓬抄，如果沒傳對象，就用默認(rèn)值對象{ x: 0, y: 0 }如果傳了對象夯到，就使用你傳遞的對象
- 箭頭函數(shù)
var f = v => v+1
//等價于
var f = function(v){return v+1}
var f = () => 5;
// 等同于
var f = function () { return 5 };
var sum = (num1, num2) => num1 + num2;
// 等同于
var sum = function(num1, num2) {
return num1 + num2;
};
var arr = [1, 2, 3]
var arr2 = arr.map(v=>v*v)
arr2 //[1, 4, 9]
箭頭函數(shù)里面的 this
// ES6
function foo() {
setTimeout(() => {
console.log('id:', this.id);
}, 100);
}
// 等同于如下ES5
function foo() {
var _this = this;
setTimeout(function () {
console.log('id:', _this.id);
}, 100);
}
對象
var name = 'jirengu'
var age = 3
var people = {name, age} //{name:'jirengu', age:3}
let app = {
selector: '#app',
init() {
},
bind() {
}
}
app.init()
``
