ES6语法学习总结

2019-11-06 06:54:22

字体：大中小

来源：转载

供稿：网友

本学习笔记的参考书是《React Native开发指南》，由【美】Bonnie Eisenman著黄为伟译

（1）解构赋值(提供了一个从对象提取数据的简便的方法！

var myobj={a:1,b:2}var a=myobj.a;var b=myobj.b;

使用解构赋值的话简写为： var {a,b}={a:1,b:2} 解构语法用的最多的是require语句中！在引入React的时候，实际上我们取出了一个对象！不适用解构语法的话：

var React=require('react-native'); var View=React.View; 使用解构语法的话： var{ View}=require('react-native');

（2）导入模块。一般情况下使用CommonJS语法导出组件以及其他一些javaScript模块！在该模块系统中，我们使用require语句来导入其他模块，使用module.exports赋值的方法导出代码供其他模块使用！

CommonJS：var OtherComponent=require（‘./other_component’）；var myComponent=React.createclass({........});module.exports= myComponent;

ES6：使用export和import关键字来替代！！

import OtherComponent from ‘./other_component’；【学过python的人应该对这个很熟悉！】var myComponent=React.createclass({........});export default myComponent；

（3）函数简写。 ES5采用以下的方法来声明函数。例如：

render：function（）{ return <Text>Hi</Text>; } ES6中的话就省略掉了：function！！！ render（）{ return <Text>Hi</Text>; }

（4）箭头函数。在ES5中为了确保上下文的（即This的值）符合预期，我们通常使用bind函数，这种方法在回调的时候经常见！

ES5： var callbackFunc=function（val）{ consolelog('Do Something!!!'); }.bind(this); ES6: var callbackFunc=(val)=>{ consolelog('Do Something!!!'); }; 总结：只是把function省略掉了，然后用箭头指向了函数的实体！！！同时不用在使用bind绑定this了！

（5）字符串插值。 ES5：连接字符串需使用以下的方式来链接字符串！

var API_KEY=“abcdefg”;var url='http://example.com/test&key='+API_KEY;

ES6:提供了字符串模板，支持多行字符串以及字符串插值，通过一堆反引号吧字符串围起来，我们就可以使用${}语法插入其他的变量了！

var API_KEY=“abcdefg”;var url='http://example.com/test&key=${API_KEY}';[有点类似于Java中的占位符？！！]

上一篇：Qt 连接mysql

下一篇：JDK、JRE、JVM