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

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值