7.12笔记 箭头函数、class类、模块

箭头函数

箭头函数有几个使用注意点：

1. 箭头函数没有自己的this对象
2. 不可以当作构造函数，也就是说，不可以对箭头函数使用new命令，否则会抛出一个错误
3. 不可以使用arguments对象，该对象在函数体内不存在。如果要使用，可以用rest参数代替
4. 不可以使用yield命令，因此箭头函数不能用作generator函数
5. 因为箭头函数里面没有this，所以箭头函数不能作为构造函数使用

					/*
						如果只有一个形参，()可以省略
						其他情况(没有参数)都不能省略
					*/
					// let f = (n) => { console.log(n * n); };
					let f = n => { console.log(n * n); };
					console.log(typeof f);//function
					f(10);//100

					/*
						如果函数体只有一行代码，{}可以省略
						如果只有一个语句并且是返回值，{}和return都可以省略 
					*/
					// let pf = (i) => { return i * i; }
					let pf = i => i * i;
					console.log(pf(20));//400

					var arr = [2, 3, 4];
					//var newArr=arr.map(function(i){return i*i;});
					var newArr = arr.map(i => i * i);
					console.log(newArr);//4 9 16

class类

• 在ES6中，class (类)作为对象的模板被引入，可以通过 class 关键字定义类。

• class 的本质是 function。

• 它可以看作一个语法糖，让对象原型的写法更加清晰、更像面向对象编程的语法。

• 类不可重复声明

• 类定义不会被提升，这意味着必须在访问前对类进行定义，否则就会报错

constructor 方法是类的默认方法，创建类的对象时被调用。也被称为类的构造方法（构造函数、构造器）。一个类必须有constructor()方法，如果没有显式定义，一个空的constructor()方法会被默认添加

        class Person{
        }

        //上面这个列子等同于下面这个
        class Person{
            constructor(){}
        }

静态方法，如果在一个方法前，加上static关键字，就表示该方法不会被实例继承，而是直接通过类来调用，这就称为“静态方法”

class People {
	static sum(a, b) {
		console.log(a + b);
	}
}
People.sum(1, 2);

类的继承

• 解决代码的复用
• 使用extends关键字实现继承
• 子类可以继承父类中所有的方法和属性
• 子类只能继承一个父类（单继承），一个父类可以有多个子类
• 子类的构造方法中必须有super()来指定调用父类的构造方法，并且位于子类构造方法中的第一行
• 子类中如果有与父类相同的方法和属性，将会优先使用子类的（覆盖）

class Fa {
}

class Son extends Fa{
}
//Fa是父类，Son是子类，它通过extends关键字，继承了Fa类的所有属性和方法

模块

模块功能主要由export和import构成，export用于规定模块的对外接口，import命令用于输入其他模块提供的功能

• ES6 的模块自动开启严格模式，不管你有没有在模块头部加上 use strict;。

• 模块中可以导入和导出各种类型的变量，如函数，对象，字符串，数字，布尔值，类等。

• 每个模块都有自己的上下文，每一个模块内声明的变量都是局部变量，不会污染全局作用域。

• 每一个模块只加载一次（是单例的）， 若再去加载同目录下同文件，直接从内存中读取。

export导出

• 可以与default一起使用，但是一个js模块中只能有一个export default语句

//导出字符串
export default "abc";

//导出数字
export default 123;

//导出布尔值
export default true;

//导出数组
export default [1,2,3];

//导出对象
var obj = {
	name: '张三',
	age: 20
}
export default obj;

//导出函数
var func = function() {
	console.log("func函数");
	return 100;
}
export default func;


//导出类
class People {
	constructor() {
		this.a = 100;
	}
	say() {
		console.log("say...");
	}
}
export default People;

import导入

• 与from关联使用，这时script标签的type必须设置为module
• 若想为输入的变量重新命名，import就需要使用as关键字

import { oldName as newName } from './profile.js';

• import命令具有提升效果，会提升到整个模块的头部，首先执行。

foo()
import {foo} from 'my_module'
//这里代码不会报错

这个笔记借鉴了阮一峰的关于es6的介绍，我的写的比较简单，若想了解的深刻一些可以看看阮一峰的es6入门 链接：link