關於React ES5和ES6用法的不同

2021-08-28 01:26:45 字數 1166 閱讀 6088

1，引入與匯出方式不同

//es5


var react = require("react");
//es6


import react,  from 'react
匯入： es5使用require匯入，而es6使用了import

//es5


module.exports = test;
//es6


export default test;
2，建立元件的方式不同

//es5


var test = react.createclass(  );
//es6


class test extends component
es5使用react.createclass()  小括號裡面需要大括號。

es6定義元件時繼承自react框架的component(需要匯入)，只需要乙個大括號。

3，初始化元件屬性的方式以及限制元件屬性型別的方式不同

//es5


var test = react.createclass(;


},proptypes: 


});//es6


class test extends component ;


static proptypes = ;


}
es5通常使用proptypes成員和getdefaultprops方法來實現。

es6可以統一使用static成員。（也可以用es5方法）。

4，初始化方法不同

//es5


getinitialstate: function() 


}//es6


state =
因為es6直接使用state初始化不能進行一些其它的運算，所以也經常這樣：

constructor(props);


}
5，es5中每個方法之後都需要加上乙個逗號，而且需要用 render: function()這樣的寫法。而es6不需要加逗號，方法也可以直接用render()，直接在名字後加括號和形參。

ES6和ES5的區別

es6和es5的區別?1 定義變數 es5中用 var function es6中用 let const class import 沒有變數提公升 同乙個作用域中不可重複宣告 不會給window增加全域性屬性 會形成塊級作用域 const設定的變數值是不可修改的 理解為常量 暫時性死區 2 解構賦值...

es6和es5的區別

1 es6新增了let命令，用來宣告變數。它的用法類似於var，但是所宣告的變數，只在let命令所在的 塊內有效。a b let不像var存在變數提公升，即變數一定要宣告之後才能使用 2 塊級作用域 es5只有全域性作用域和函式作用域，沒有塊級作用域 3 變數的結構賦值 var a,b,c 1,2,...

es5和es6的區別

最近在看阮一峰的 ecmascript6入門 講真，這本書對初學者真的很有幫助，在這裡也推薦給大家。接下來，我要說的一些例子也大多 於這本書，如果對這本書感興趣的小夥伴，也可以戳這裡哦！1.新增let命令 在es6之前，我們宣告變數都是通過var，es6新增的let命令與var類似，與之不同是，le...