es6
(1) 模組化:
export default
export function fn1()
export function fn2()
import util from './util1.js'
import from './util2.js'
(2) 使用babel:
npm install babel-core babel-preset-es2015 babel-preset-latest
建立.babelrc檔案
npm intall -g babel-cli 安裝babel的命令列工具
babel --version
babel myfile.js 直接輸出到終端
babel myfile.js -o upfile.js 將結果寫到新的檔案
babel src -d build: src目錄對應build目錄的輸出
babel是外掛程式機制,只安裝babel-core不能將es5進行轉換,必須要按照相應的外掛程式
乙個外掛程式只能做一件事情,可以使用預設(一堆外掛程式)
npm install babel-preset-es2015
在.babelrc中寫
babel-preset-latest: 是乙個特殊的presets,總是包括最新的編譯外掛程式
babel-preset-env: 只編譯所編譯環境所缺少的**,比較推薦
如使用webpack,需要安裝babel-loader
module: ,
"modules": false,
"loose": true
}],'stage-2',
'react'],}
}]}
如使用gulp,需要安裝gulp-babel
babel幾乎可以編譯所有的新的js語法,但是對於api來說並非如此,新增的物件如promise和array.find()等方法,並沒有轉換。
這時需要用到babel-polyfill或者babel-runtime
(3) promise
new promise例項,而且要return
new promise時要傳入函式,函式有resolve和reject兩個引數
成功時執行resolve(),失敗時執行reject()
then監聽結果
function loadimg(src)
img.οnerrοr=function()
})return promise
}var src=''
var result=loadimg(src)
result.then(function(img),function())
(4)其他
let/const:
多行字串/模板變數:
const html = `$
`
解構賦值
const obj=
const =obj
console.log(a) //10
console.log(c) //40
函式預設引數
function(a, b=0){}
可以用來代替:
function(a,b)
}
箭頭函式 前端 ES6總結
1 arr.push 在陣列末尾新增元素,返回陣列長度 let arr 1,2,3 let length arr.push 4 console.log length 4console.log arr 1,2,3,4 2 arr.unshift 在陣列首位新增元素,返回陣列長度 let arr 1,2...
前端學習筆記 ES6
1 塊級作用域 任何一對花括號 中的語句集都屬於乙個塊,在塊中宣告的變數在 塊外都是不可訪問的,稱之為塊級作用域,es5以前沒有塊級作用域 2 let 關鍵字 let用於宣告變數 類似於var 其宣告的變數只在當前 塊內有效,實際上是建立了塊級作用域 1 建立塊級作用域 if true consol...
前端ES6簡單總結
首先是es6當中新增了 let有以下2個特點 1.作用域嚴格 2.不允許重名和重複賦值 console.log a console.log b 這樣的話執行時會報a沒賦值的錯誤 let a 123 var b 456 var b 789 這樣執行之後b是789,a是123 let a 123 let...