先說兩種方式的原理:
babel-polyfill,它不會(huì)將代碼編譯成低版本的ECMAScript,他的原理是當(dāng)運(yùn)行環(huán)境中并沒有實(shí)現(xiàn)的一些方法,babel-polyfill中會(huì)給做兼容
babel-runtime,將es6編譯成es5去運(yùn)行,前端可以使用es6的語法來寫,最終瀏覽器上運(yùn)行的是es5
優(yōu)缺點(diǎn):
babel-polyfill:通過向全局對象和內(nèi)置對象的prototype上添加方法來實(shí)現(xiàn),比如運(yùn)行環(huán)境中不支持Array-prototype.find,引入polyfill,前端就可以放心的在代碼里用es6的語法來寫;但是這樣會(huì)造成全局空間污染。比如像Array-prototype.find就不存在了,還會(huì)引起版本之前的沖突。不過即便是引入babel-polyfill,也不能全用,代碼量比較大。
babel-runtime:不會(huì)污染全局對象和內(nèi)置的對象原型。比如當(dāng)前運(yùn)行環(huán)境不支持promise,可以通過引入babel-runtime/core-js/promise來獲取promise,或者通過babel-plugin-transform-runtime自動(dòng)重寫你的promise。但是它不會(huì)模擬內(nèi)置對象原型上的方法,比如Array-prototype.find,就沒法支持了,如果運(yùn)行環(huán)境不支持es6,代碼里又使用了find方法,就會(huì)出錯(cuò),因?yàn)閑s5并沒有這個(gè)方法