es6小結1

es6通常使用babelrc來轉換成es5的來兼容低級版本的瀏覽器

 

 

1.循環迭代：

for...of循環是ES6中新加的一種遍歷迭代器的語法,不能遍歷對象

var arr = ['nick','freddy'];

arr.name = "數組";

for(var i in arr){

console.log(i+': '+arr[i]);//0:nick 1:freddy name:數組

}

for(var item of arr){

console.log(item);//nick freddy

}

給數組添加一個自定義屬性name，而且賦值"數組"。而後進行遍歷輸出的，會發現新定義的屬性也被for in輸出來了，而for of並不會對name進行輸出。

 

2.let,const:

let 的做用域是在它所在當前代碼塊，但不會被提高到當前函數的最頂部。

const 聲明的變量都會被認爲是常量，表示它的值被設置完成後就不能再修改了。

若是const的是一個對象，對象所包含的值是能夠被修改的。就是對象所指向的地址沒有變就行。

 

3.模板字符串

第一種，基本的字符串格式化。字符串的拼接

es5: var name = 'ff'

alert('hello'+name)

es6: const name = 'ff'

alert(`hello ${name}`)

第二種，在es5時咱們能夠經過反斜槓(\)來作多行字符串或者字符串一行行拼接，es6反引號(``)直接搞定。

es5: var msg = "\

<div>1231</div>\

<span>dfasd</span>"

es5: conse msg = `<div>

<span>wfdsf</span>

</div>`

此外還有一些比較厲害的方法：

1).includes: 判斷是否包含而後直接返回布爾值

const str = 'hhhrty'

alert(str.includes('t)) //true

2).repeat: 獲取字符串重複n次,若是帶有小數按照Math.floor(num)處理

const str = 'he'

alert(str.repeat(3)) //hehehe

3).startsWith和endsWith判斷是否以給定文本開始或者結束

const str = 'hello wwww!'

alert(str.startsWith('hello')) //true

alert(str.endsWith('!')) //true

 

4.函數

函數默認值

es5: function action(num) {

num = num || 200

return num

}

當傳入num的時候，num爲傳入的num值，沒有傳參的時候就是200，可是當num=0的時候，此時num會爲200，與咱們實際想要的效果明顯不同。

es6爲參數提供了默認值，在定義函數初始化時就初始化了這個參數，如：

function action(num = 200){
console.log(num)
}
action(0)//0
action()//200
action(300)//300

箭頭函數：

直觀的三個特色：不須要function關鍵字來建立函數；省略return關鍵字；繼承當前上下文的this關鍵字。

當函數有且僅有一個參數的時候，是能夠省略括號的；當函數返回有且只有一個表達式的時候能夠省略{}和return；例如

let people = name => 'hello' +name 
let people = (name.age) => {
　　const fullName = 'hello' + name
　　return fullName
} 

未完待續加班中....