es6学习(2)

函数的相关学习

默认参数的基本用法。

function fn(name,age = 17) {
    console.log(name + " " + age);
}
fn("Amy");

age参数可以不必进行传入而使用该函数
只有在没有传递参数，或者参数为undefined时候，才能使用默认参数，null值被认为是有效的传递.

1	fn("ckq",null);

该种情况age会输出为null

1	fn("ckq",undefined);

该种情况age会输出17，而不会输出undefined.

不定参数用来表示不确定的参数个数，形如 …变量名，有…加上一个具名参数标识符组成，具名参数只能放在参数组的最后，并且有且只有一个不定参数。

function f(...values) {
    console.log(values.length);
}
f(1,2,3);

箭头函数
提供了一种更加简洁的函数书写方式，基本语法是
参数 => 函数体

1 2	var f = (v,x) => {return v * 2}; console.log(f(2,3));

当有多个参数的时候用括号包起来，当有多个执行语句的时候用{}包裹起来。
箭头函数里面是没有this对象的，此时的this对象是外层的this对象，即windows对象。

1
2
3

var func = () => {
    console.log(this);
}

指的是windows这个对象。
定义函数的方法。且该方法中包含this变量，此时，this指向全局windows，所以定义方法的时候必须指定function.

var person = {
    "age":18,
    'sayHello':() => {
        console.log(this.age);
    }
}
var age = 12;
person.sayHello();
var Person1 = {
    'age': 18,
    'sayHello': function () {
        console.log(this.age);
    }
};
var age = 20;
Person1.sayHello();   // 18

ES6迭代器

iterator是es6新引入的一种遍历机制，迭代器有两个核心概念。
1.迭代器是一个统一的接口，它的作用是使各种数据结构可被快捷的访问。它是通过一个键为Symbol.iterator来实现。
2.迭代器是用于遍历数据结构元素的指针(如数据库中的游标)
迭代的过程如下
1.通过Symbol.iterator创建一个迭代器，指向当前数据结构的起始位置
2.随后通过next方法进行向下迭代指向下一个位置，next方法回返回当前位置的对象，对象包含了value和done两个属性。value是当前属性的值，done用于判断是否遍历结束.
3.当done为true的时候，则遍历结束.
下面通过简单的例子来说明。

const items = ['zeros','one','two'];
const it = items[Symbol.iterator]();
console.log(it.next());
console.log(it.next());
console.log(it.next());
console.log(it.next());

创建迭代器，随后不断的调用next方法对数组内部进行访问。当属性done为true时访问结束。
迭代器是协议的一部分，用于迭代，该协议的一个关键特性便是它是顺序的。迭代器一次返回一个值，这意味着如果可迭代数据结构是非线性的(例如树),则会转化成线性
以下是可迭代的数据结构array,string,map,set
for…of进行迭代循环。

1
2
3

for(let item of items){
    console.log(item);
}

普通对象是无法进行迭代的，可以使用array.from来进行转化为可迭代对象.

const arrayLink = {length:2,0:"zero",1:"one"};
for(let item of Array.from(arrayLink)){
    console.log(item);
}

class类

class(类)作为对象的模板被引入，可以通过class关键字定义类。
class的本质是function。可以看做是一个语法糖，让对象原型的写法更加清晰。更像面向对象编程的方法。
类的声明

let Example = class  {
    constructor(a){
        this.a = a;
    }
}
 
let example = new Example(2);
console.log(example.a);

注意点：类的定义不会被提升，这意味着，必须在访问前对类进行定义，否则会报错。
constructor是默认的构造方法。instanceof判断两个对象是否相同。是属于同一个原型链的。

1	console.log(example instanceof Example);

extends方法用来继承

1	class Child extends Father{...}

子类constructor方法中必须有super,且必须出现在this之前。

    class Father {
     constructor(a){
         console.log(a);
     }
    }
    class Child extends Father {
        constructor(a){
            super(a);
        }
    }
var child = new Child(2);

es6模块

es6引入了模块化的思想，其设计思想是在编译期间就能确定模块的依赖关系，以及输入和输出的变量。
es6的模块化分为导出export和导入import
每一个模块内的是局部变量，不会污染全局作用域。
每一个模块只加载一次(是单例的),若再去加载同目录下的同文件，直接从内存中读取。
export命令可以出现在模块的任何位置，但必须处于模块顶层。
import命令会提升至整个模块的头部，首先执行，

let name = "tom";
let age = 20;
let myFn = function () {
    return "222";
}
export {name,age,myFn};
import {name,age,myFn} from "./test.js";

导入和导出

export命令导出的接口名称，须和模块内部的变量有一一对应关系。
导入的变量名，须和导出的接口名称一致，即顺序可以不一致。
import可以改变对象的属性，但不能改变基本类型的值。

import {a} from "./xxx.js"
a = {}; // error
 
import {a} from "./xxx.js"
a.foo = "hello"; // a = { foo : 'hello' }

promise对象

是异步编程的一种解决方法。promise是一种状态，从它可以获取异步操作的信息。
有三种状态,pending(进行中)，fulfilled(已成功，rejected(已失败).
Promise 对象只有：从 pending 变为 fulfilled 和从 pending 变为 rejected 的状态改变。只要处于 fulfilled 和 rejected ，状态就不会再变了即 resolved（已定型）。

async函数

async是es7才有的与异步操作有关的关键字，和promise,generator有很大的关联。
async function name([param[, param[, … param]]]) { statements }
name:函数名称
param:要传递给函数的参数的名称
statements:函数体语句
async函数返回一个promise对象，可以使用then方法添加回调函数。

async function helloAsync() {
    return "helloAsync";
}
console.log(helloAsync());
helloAsync().then(function (v) {
    console.log(v);
})

可以通过then方法打印出来。
async函数中可能会有await表达式，async函数执行时，如果遇到await就会先暂停执行，等到触发的异步动作完成之后，恢复async函数的执行并返回解析值。

function testAwait(){
    return new Promise((resolve) => {
        setTimeout(function(){
            console.log("testAwait");
            resolve();
        }, 1000);
    });
}
async function helloAsync() {
    await testAwait();
    console.log("helloAsync");
}
helloAsync();

await操作符用来等待一个promise对象，只能在异步函数async function内部使用.
返回 Promise 对象的处理结果。如果等待的不是 Promise 对象，则返回该值本身。

如果一个 Promise 被传递给一个 await 操作符，await 将等待 Promise 正常处理完成并返回其处理结果。

function testAwait(){
    return new Promise((resolve) => {
        setTimeout(function(){
            console.log("testAwait");
            resolve(222);
        }, 1000);
    });
}
async function helloAsync() {
  var x =   await testAwait();
  console.log(x);
    console.log("helloAsync");
}
helloAsync();

这样会返回一个222给x，打印输出。
await针对所跟不同表达式的处理方式:
promise对象：await会暂停执行，等待promise对象返回resolve,然后恢复async函数的执行并返回解析值。
非promise:直接返回对应的值。

function testAwait(){
    return ("testAwait");
  }
  async function helloAsync(){
    console.log(await testAwait());
      console.log("helloAsync");
  }