ES6语法第二天

目录

一、箭头函数

1. 更简洁的语法：

2、不绑定 this

3、不绑定 arguments 对象

4、不适合作为构造函数

二、模版字符串 

1、语法规则

2、模版字符串 ${ }，可以解析变量和函数

3、模版字符串的一些方法

三、symbol

1、获取symbol中的值：description 

2、Symbol.for（） ：通过for指定一个symbol空间(借用)

3、keyFor：通过变量名，反向查找symbol数据

四、ES6中object的新增属性

1、defineproperty

2、writable: false  禁止修改

3、delete  删除对象的属性

---

一、箭头函数

        箭头函数（Arrow Function）是作为函数的省略写法来进行，在特定情况下省略一些符号来达成简便的代码，是 ECMAScript 6（ES6）中引入的一种新的函数表达式，它使用 => 符号来定义函数

1. 更简洁的语法：

        箭头函数的语法比普通函数更简洁，省略了 function 关键字以及花括号 {} 

  //写入函数时，可以直接省略function将其替换为 =>
  let a = () => {
    console.log(this);
  }
  a()


  // 方法只有一句时，{}可以省略
  let b = () => console.log(this)
  b()



  // 参数有且只有一个，()可以省略
  let c = a => console.log(a)
  c(1)


  // 方法只有一句 ，并且是return   return可以省略
  let d = a => a

2、不绑定 this

        箭头函数不会创建自己的 this 上下文，它会捕获其所在上下文的 this 值（即父级作用域所存在的this指向）。这使得在回调函数和事件处理程序中使用箭头函数更加方便        

3、不绑定 arguments 对象

        箭头函数没有自己的 arguments 对象，可以使用剩余参数（Rest Parameters）来解决这个问题

4、不适合作为构造函数

        箭头函数不能用作构造函数，不能使用 new 关键字调用，也没有原型链

        后续对于原型和原型链的学习建立在ES5语法中的构造函数的基础上，学习ES6中的class（类）来完成。而构造函数的核心在于使用new调用，所以在箭头函数new关键字失效的情况下，其并不适合作为一种构造函数的写法。

        且由于原型某种意义上是一种代码优化方案，即这种方式不一定使用的情况下，为保证后续的代码开发，请严格遵守构造函数使用方法

二、模版字符串 

        模版字符串（Template Strings），也被称为模板字面量（Template Literals），是 ECMAScript 6（ES6）中引入的一种新的字符串语法。它们可以用来定义多行字符串，或者在字符串中嵌入表达式。

1、语法规则

        模版字符串使用反引号即 （ ` ` ），来定义字符串，在模版字符串中可以使用 `${string}` 的方式来嵌入Javascript表达式。

2、模版字符串 ${ }，可以解析变量和函数

        可以使用${ }来替换 "+ +" 的拼接方式，在ES6语法中可以进行解析

  var obj = {
    name: "a",
    age: 18,
    sex: "nan",
    url: "https://www.baidu.com/"
  }

  console.log("我叫" + obj.name + "，今年" + obj.age + "，性别" + obj.sex);

  console.log(`我叫${obj.name}，今年${obj.age}，性别${obj.sex}`);

        使用模版字符串也可以进行函数的解析，将其转换为字符串

    var obj = {
    name: "a",
    age: 18,
    sex: "nan",
    url: "https://www.baidu.com/"
  }

    var age = 10
  function fn(name) {
    return name + age
  }

  console.log(`${fn("小明")}`);

 

3、模版字符串的一些方法

        （1）startsWith（） ：表示参数字符串是否在原字符串开头 ，返回布尔值
        （2）endsWith（） ：表示参数字符串是否在原字符串结尾 ，返回布尔值

  let str1 = "abcdefg"
  console.log(str1.startsWith("ac"));//flase
  console.log(str1.endsWith("fg"));//true

        （3） repeat( n )：将原字符串重复n次

  let str2 = "我爱你祖国"
  console.log(str2.repeat(100));

三、symbol

        symbol作为ES6新增的基本数据类型 ，存储关键数据或者服务器数据，用于表示一个独一无二的值

1、获取symbol中的值：description 

console.log(c.description == d.description);

2、Symbol.for（） ：通过for指定一个symbol空间(借用)

let a = Symbol.for(6)

3、keyFor：通过变量名，反向查找symbol数据

        只有for声明出来的symbol数据，才能通过Symbol.keyFor查找

  let g = Symbol.keyFor(e)
  console.log(g);

四、ES6中object的新增属性

1、defineproperty

         JavaScript 中的一个方法，它是 Object 对象的一个静态方法，用于在对象上定义一个新属性或修改一个对象的现有属性，并返回该对象。

Object.defineproperty(obj,prop,description)  重新定义属性

  // 1. obj：要添加或修改其属性的对象。
  // 2. prop：要定义或修改的属性的名称，以字符串形式表示。
  // 3. descriptor：一个描述符对象，该对象定义了属性的特性，
  //    如是否可写、是否可枚举、是否可配置以及属性的值。

2、writable: false  禁止修改

  Object.defineProperty(obj, "tag", {
    value: "新增属性",
    writable: false
  })

3、delete  删除对象的属性

  Object.defineProperty(obj, "height", {
    value: "180cm",
    enumerable: true,
    configurable: true
  })
  delete obj.height