es5与es6常用语法教程(5)

作者: 光强_上海 | 来源:发表于2017-11-08 17:42 被阅读138次

    js常用语法系列教程如下

    本节教程主要讲解以下几个常用语法

    • 获取函数的名字
    • 对象表达式
    • 对象的拷贝
    • __proto__

    获取函数的名字

    • 有时候我们有获取函数名字的需求,这时我们可以使用下面的方式
    function breakfast() {}
    console.log(
      breakfast.name // breakfast
    )
    
    • 匿名函数
    let breakfast = function () {}
    console.log(
      breakfast .name  // breakfast 
    )
    

    对于匿名函数,变量breakfast就成了函数名

    • 非匿名函数
    let breakfast = function supreBreakfast() {}
    console.log(
      breakfast .name  // supreBreakfast,匿名函数的优先级低 
    )
    

    对象表达式

    let dessert = '🍰', drink = '🍺'
    
    let food = {
      dessert: dessert,
      drink: drink ,
    }
    
    console.log(food) // {dessert: "🍰", drink: "🍺"}
    
    • 如果想在对象中添加和变量名一样的属性名,并且这个属性的值就是这个变量表示的这个值,我们可以直接在这个对象中加上这个属性,而不需要再去指定属性的值了,这时我们可以去掉冒号右边变量的名字。
    let dessert = '🍰', drink = '🍺'
    let food = {
      dessert,
      drink,
    }
    console.log(food) //{dessert: "🍰", drink: "🍺"}
    
    • 也可以在对象中直接添加一个方法
    let dessert = '🍰', drink = '🍺'
    let food = {
      dessert,
      drink,
      breakfast() {}
    }
    
    console.log(food) // {dessert: "🍰", drink: "🍺", breakfast: ƒ}
    

    对象的拷贝(Object.assign)

    let breakfast = {}
    
    // 将{drink: '啤酒'} 对象拷贝到breakfast对象中
    Object.assign(breakfast, {drink: '啤酒'})
    
    console.log(breakfast) // {drink: "啤酒"}
    
    • Object.assign()函数的第一个参数是拷贝到的目标对象
    • 第二个参数是需要拷贝的对象

    proto

    let breakfast = {
      getDrink() {
        return '混泥土王'
      }
    }
    
    let dinner = {
      getDrink(){
        return '混泥土张'
      }
    }
    
    let sunday = {
      __proto__: breakfast
    }
    
    console.log(sunday.getDrink()) // 混泥土王
    console.log(Object.getPrototypeOf(sunday) === breakfast) // true
    
    // 设置对象的prototype
    sunday.__proto__ = dinner
    console.log(sunday.getDrink()) // 混泥土张
    console.log(Object.getPrototypeOf(sunday) === dinner) // true
    

    福利时间

    • 作者React Native开源项目OneM地址(按照企业开发标准搭建框架设计开发):https://github.com/guangqiang-liu/OneM (欢迎小伙伴们 star)
    • 作者简书主页:包含50多篇RN开发相关的技术文章http://www.jianshu.com/u/023338566ca5 (欢迎小伙伴们:多多关注多多点赞)
    • 作者React Native QQ技术交流群:620792950 欢迎小伙伴进群交流学习
    • 友情提示:在开发中有遇到RN相关的技术问题,欢迎小伙伴加入交流群(620792950),在群里提问、互相交流学习。交流群也定期更新最新的RN学习资料给大家,谢谢支持!

    相关文章

      网友评论

        本文标题:es5与es6常用语法教程(5)

        本文链接:https://www.haomeiwen.com/subject/qexymxtx.html