es6中运算符与语句

1.箭头函数

定义式：var fn=function () {}

声明式：function fn() {}

箭头函数：var fn=(a,b)=>{}

var fn=(a,b)=>{
    console.log(this,111) // window,111
    retrun a+b
}
var obj={name:"jack",fn}
var re=obj.fn(100,200)

// this是离它最近的嵌套的function/方法这个函数的调用者 直到顶层都没有就是window

var obj={
    name:"jack",
    say:function(){
        var fn=(a)=>{
            console.log(this,11) // {name:"jack",say:f},11
            return 100
        }
        fn(2) // fn函数的调用者 window
    }
}
obj.say() // 调用者 obj

var fn=(a,b)=>{
    console.log(a+b)
    return a-b
}
fn(100,200)

如果箭头函数的执行体只有一个表达式，就是返回值，那么可以省略大括号

var fn2=(a,b)=>a*b
如果箭头函数的形参只有一个，可以省略参数体小括号

var fn3=a=>a*a

 注意：箭头函数不能用来创建对象，没有 this、super、arguments 和 new.target 绑定。

总结

• 要有个箭头

• 箭头的前面是小括号，放形参，只有一个形参的时候可以省略小括号；

• 箭头的后面是函数体；

• 如果函数体只有一个语句，没有{}，此时的返回值不需要return；

• 箭头函数里面的this总是指向最靠近的function 内部的this；

• 对象里面的方法，尽可能不要使用箭头函数；

• 箭头函数里面没有arguments，可以使用…reset，接收过来就是数组类型，接收的是形参之外的所有的实参；

2.模块

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 语句，那么只会执行一次，而不会执行多次。import 同一模块，声明不同接口引用，会声明对应变量，但只执行一次 import

<script type="module">
	import People from './js/myModule.js';
	let p = new People();
	p.say();
</script>

 3.类

js是什么语言？

js是一个基于面向对象设计的单线程的静态脚本语言

面向对象（类，实例对象，继承，封装，多态）

基于面向对象设计 （本质没有继承，类等语法，但是按照自己的语法特征（原型思想） ）

单线程 （代码只能一个业务一个业务的执行）

静态 

脚本语言（嵌入式语言）

声明类
class person{}
let p1=new Person()
console.log(p1)
匿名类
var fn=class{}
var f1=new fn()
console.log(f1)

js没有类，是原型的思想设计的类，但是学习和使用这个技术时，要用类的思想学习

class Person{
    constructor(a,b,c){
        console.log(66)
        this.x=a
        this.b=b
    }
    //对象的属性
    life=50
    //对象的原型对象的方法
    say1(){
        console.log(111,this.x)
    }
    //静态属性
    static life=200
    //静态方法
    static say2(){
        console.log(222)
    }
}
console.log(typeof(Person)) // function
var p1=new Person(10,20,30)
//Person类的内部可以写一个constructor方法，用这个类创建对象时，就会运行构造函数
// 不写构造函数，系统就会默认有一个空的构造运行
console.log(p1) // {x:10,b:20，life：50} life在对象中，say1在原型对象上,但是没有静态属性和静态方法
console.log(Person.life) // 200
console.log(Person.say2) // 222
静态属性和方法只在Person中，不在新创建的p1对象上

 继承

class Student extends Person{
    constructor(name){
        super(name) // 让Person类的构造函数的逻辑去帮我们构建对象空间
        this.age=20
        this.book="书名"
    }
}
var s1=new Student("marry")
console.log(s1) 
结果继承了Person的，同时新增了age和book两个属性

• 解决代码的复用

• 使用extends关键字实现继承

• 子类可以继承父类中所有的方法和属性

• 子类只能继承一个父类（单继承），一个父类可以有多个子类

• 子类的构造方法中必须有super()来指定调用父类的构造方法，并且位于子类构造方法中的第一行

• 子类中如果有与父类相同的方法和属性，将会优先使用子类的（覆盖）