第一章 初认识

前端UI本质问题:如何将从服务器的传过来的动态数据和用户的交互行为高效地反应到复杂的用户界面.

1.2 ES6——小舅子

想要见佳人，先过小舅子一关。React项目一般都是ES6语法写的，所以想要熟练掌握React开发，小舅子这一关必须要过吧、

1、let const
都是块级作用域，只在块内有效。const声明一个只读的变量。声明后只能读不能写。

2、箭头函数
一个箭头，省掉了function和return。写法就是
var f = (a,b)=>(a+b)
this的指向是定义时候的上下文，不是执行时候的上下文。
记忆口诀：等于参数，箭头返回，多参小括，多语大括。

3、模板字符串
`` 反引号，可以定义字符串和多行字符串，已经在其中嵌入标量。比如
var name="王海洋" ; `${name} 写字还不错`

4、解构赋值

ES6允许按照一定模式从数组和对象中提取值，对变量进行赋值。说白了就是结构分解。一个萝卜对一个坑儿 timg.jpg
比如：let [a,b,c] = [1,2,3] 萝卜和坑对应起来，就是a为1，b为2，c为3 。除了数组解构，还可以有对象解构。参数（包括对象参数和数组参数）也可以解构。同样可以有嵌套的数组解构。let [a,[b,c],d] =[1,[2,3],4],同样还有嵌套解构的对象解构。

5、rest参数
rest：剩余的意思。也就是剩下所有的参数。所以他后面也不可能有其他的参数了。
function languages（lang，...type）{ console.log(type) }
languages（"java","C","C++"）//["C","C++"]

6、扩展运算符将数组转化为逗号分割的参数序列、
区别：
rest
变量将多余的参数放入数组中。

function add(...values) {
    let sum = 0;

    for (var val of values) {
    sum += val;
      }
    return sum;
    }
add(2, 5, 3) // 10

扩展运算符
rest 参数的逆运算，将一个数组转为用逗号分隔的参数序列。
console.log(...[1, 2, 3])
扩展运算符可以处理对象，如对象的合并：

image

总结：二者为逆操作。

7、class
class可以定义一个类，也可以用来继承一个类。

8、import、export

const foo=()=>'foo';
const bar =()='bar';
export default foo; //导出默认接口
export {bar};//导出普通接口

1、export与export default均可用于导出常量、函数、文件、模块等
2、你可以在其它文件或模块中通过import+(常量 | 函数 | 文件 | 模块)名的方式，将其导入，以便能够对其进行使用
3、在一个文件或模块中，export、import可以有多个，export default仅有一个
4、通过export方式导出，在导入时要加{ }，export default则不需要