重学ES6之出来混迟早要还的二还没写完版

默认参数值（Default parameters）

函数默认参数允许在没有值或undefined被传入时使用默认形参。

1.语法

function [name]([param1[ = defaultValue1 ][, ..., paramN[ = defaultValueN ]]]) { 
    statements 
}

2.使用
2.1 在ES6之前可以通过逻辑运算符来给形参指定默认值

格式: 条件A || 条件B
如果条件A成立, 那么就返回条件A
如果条件A不成立, 无论条件B是否成立, 都会返回条件B

 function getInfo(a, b) {
    a = a || "今天要少吃，";
    b = b || "明天也要少吃";
    console.log(a, b);
}
getInfo(); //打印默认值 --> 今天要少吃，明天也要少吃
getInfo("mss"); //相当于传递了参数a，未传参数b --> mss 明天也要少吃
getInfo(undefined,"mss"); //表示参数a是未知的，此时采用默认值 --> 今天要少吃, mss
getInfo(123, "abc"); //参数ab都是由外界传递的 --> 123 "abc"

2.2 从ES6开始直接通过变量=指定默认值即可给形参指定默认值

function getInfo(a = "今天要少吃", b = ", 明天也要少吃") {
    console.log(a, b);
};
getInfo(); //今天要少吃, 明天也要少吃
getInfo(123, "abc"); //123 "abc"

注意：① 如果只传递了一个参数，则代表第一个参数使用我们传递进来的，其他参数还是使用默认值。
② 如果需要给某一个参数指定内容，其他参数需要传递undefined
③ 问：给其他参数传递null可以吗？答：别问，问就是不可以，问就是让你自己回去试

function multiply(a = 3, b = 5) {
   return a * b;
}
console.log(multiply(5, 2)); // ab均为传递进来的值，为10
console.log(multiply(5)); // a是5，b是默认值5，结果为25
console.log(multiply(undefined,10)); //a是默认值3，b是10，结果为30

function test(a = 1,b = 2, c = 3, d = 4) {
    return a + b + c + d;
}
console.log(test(undefined, undefined, 4, undefined)); //11

2.3 ES6开始的默认值还可以从其它的函数中获取

function getSum(a = "少吃,", b = getDefault()) {
    console.log(a, b);
}
getSum();
// getSum(123, "abc");
function getDefault() {
    return "零食";
}

模板字符串（Template literals (Template strings)）

模板字面量 是允许嵌入表达式的字符串字面量。你可以使用多行字符串和字符串插值功能。
1.语法
将需要插入的内容放在一对反引号“里面

模板字符串使用反引号来代替普通字符串中的用双引号和单引号。模板字符串可以包含特定语法（${expression}）的占位符。占位符中的表达式和周围的文本会一起传递给一个默认函数，该函数负责将所有的部分连接起来，如果一个模板字符串由表达式开头，则该字符串被称为带标签的模板字符串，该表达式通常是一个函数，它会在模板字符串处理后被调用，在输出最终结果前，你都可以通过该函数来对模板字符串进行操作处理。在模版字符串内使用反引号（`）时，需要在它前面加转义符（）。

`string text` //单行

`string text line 1
 string text line 2` //多行

`string text ${expression} string text` //包含特定语法（${expression}）的占位符

tag `string text ${expression} string text` //标签模板字符串

2.用法
2.1 在ES6之前可以通过加号实现字符串拼接，但有时创建标签时不能体现出html标签的层级结构，比较繁琐而且容易出错。

let name = 'ghk';
let age = 22;
let output = name + ' is ' + age;
console.log(output);

2.2 采用模板字符串简化操作，引入的变量用${}包裹起来，${expression}中的expression的内容可以是一个变量、对象的属性、也可以是一个函数、一个需要创建的标签

let name = 'ghk';
let age = 22;
let output2 = `${name} is ${age}`;
console.log(output2);

let output3 = `${name} is ${age * 3}`;
console.log(output3);

2.3 模板字符串书写上可以自由换行，而不用添加“\”反斜杠转义空格。模板字符串创建标签时，有时会保留标签前后的空格，不需要空格时可以用.trim()方法去除空格(模板字符串也是个字符串)。

let str = `<div>
    <p><img src="./images.test.jpg" alt=""></p>
</div>`
let str = `
<div>
    <p><img src="./images.test.jpg" alt=""></p>
</div>.trim()`
console.log(str);

2.4 模板字符串里面可以嵌套嵌套模板字符串…

let person = {
    name: 'mss',
    lists:[
        {task: 'reading'},
        {task: 'sleeping'},
        {task: 'eating'}
    ]
};
let template = `
    <ul>
         ${person.lists.map(list =>`
             <li>
                 ${list.task}
             </li>
         `).join('')}
    </ul>
`;
document.body.innerHTML = template;

标签模板字符串

模板字符串是通过一个默认的函数对其中的插值进行运算和连接的。

更高级的形式的模板字符串是带标签的模板字符串。标签使您可以用函数解析模板字符串。标签函数的第一个参数包含一个字符串值的数组。其余的参数与表达式相关。最后，你的函数可以返回处理好的的字符串（或者它可以返回完全不同的东西）。用于该标签的函数的名称可以被命名为任何名字。

1.用法
1.1 标签函数第一个参数(strings)是一个数组，是由字符串的字面量组成的一个数组；后面的参数是不定参数(即变量)，一个参数代表一个表达式的计算结果。

function myTag(strings, ...values) {
   console.log(strings);
   console.log(values);
}
let name = 'ghk';
let task = 'learning English';
let output = myTag`${name} has planned to ${task}`;

!
1.2 当然了，不定参数是可以分开写的，但是如果有多个参数的时候建议还是使用...values

function myTag(strings,name,task) {
   console.log(strings);
   console.log(name);
   console.log(task);
}
let name = 'ghk';
let task = 'learning English';
let output = myTag`${name} has planned to ${task}`;

2.注意点
2.1 当模板字符串是以变量开头或者结尾的时候，返回的数组前或者后会多一个空字符串

如果此时在模板字符串前后加上一些内容，前后就不会返回空字符串了

function myTag(strings,...values) {
   console.log(strings);
   console.log(values);
}
let name = 'ghk';
let task = 'learning English';
let output = myTag`the boy ${name} has planned to ${task}.`;

2.2 在上述中使用了标签函数创建的模版字符串，但没有在标签函数中return最终值，所以output是undefined。要想有最终结果需要在标签函数中将字符串字面量数组和表达式运算结果拼接起来返回。

function myTag(strings,...values) {
   //console.log(strings);
   //console.log(values);
   let arr = [];
   for (let i=0;i<strings.length;i++){
       arr.push(strings[i]);
       arr.push(values[i]);
   }
   return arr.join("");
}
let name = 'ghk';
let task = 'learning English';
let output = myTag`the boy ${name} has planned to ${task}.`;
console.log(output); //the boy ghk has planned to learning English.

3.原始字符串
3.1 在标签函数的第一个参数中，存在一个特殊的属性raw ，我们可以通过它来访问模板字符串的原始字符串，而不经过特殊字符的替换。
3.2 使用String.raw() 方法创建原始字符串和使用默认模板函数和字符串连接创建是一样的。

let name = 'ghk';
let task = 'learning English';
let str=String.raw`the boy ${name} has planned to ${task}.`;
console.log(str); //the boy ghk has planned to learning English.