zoukankan      html  css  js  c++  java
  • ES6学习笔记(五)—— 编程风格

    1. 块级作用域

    • let 取代 var —— let 只在声明的代码块内有效,而且不存在变量提升的效用
    • const 取代 let —— const 比较符合函数式编程的思想,运算不改变值,只是新建值;JS 编译器会对 const 进行优化,使用 const 有利于提高程序的运行效率
    • 所有的函数都应该设置成为常量
    const [a, b, c] = [1, 2, 3]

    2. 字符串
    静态字符串使用单引号或者反引号,动态字符串使用反引号配合 ${ }

    const a = 'Monica'
    const b = `${a} is my good friend`

    3. 解构赋值
    使用数组成员对变量赋值时

    cosnt [a, b] = [1, 2, 3, 4]

    函数的参数是对象的成员

    const getInfo = (info) => {
        const { name, age } = info
    }
    const getInfo = ({ name, age }) => {
        // ...
    }

    4. 对象
    单行定义的对象,最后一个成员不以逗号结尾。多行定义的对象,最后一个成员以逗号结尾。

    const a = { k1: v1, k2: v2 }
    const b = {
        k1: v1,
        k2: v2,
    }

    对象尽量静态化,一旦定义,就不得随意添加新的属性。如果添加属性不可避免,要使用 Object.assign() 方法。

    const info = {}
    Object.assign(info, { name: 'wangxi' })

    对象的属性和方法,尽量采用简洁表达法,这样易于描述和书写。

    const userInfo = {
        name,
        gender: 'male',
        getAge () {
            return '25'
        },
    }    

    5. 数组
    使用扩展运算符(...)拷贝数组。

    const a = [1, 2, 3, 4]
    const b = [...a]

    使用 Array.form() 将类数组对象转化为数组。

    const infoObj = { name: 'wangxi', age: 25, length: 2 }
    const infoArr = Array.from(infoObj)

    6. 函数

    立即执行函数写成箭头函数的形式。

    (() => {
        console.log('I am the best')
    })()

    使用默认值语法设置函数参数的默认值。

    const userInfo = (name = 'wangxi') => {
        // ...
    }

    7. Map 解构
    只有模拟现实世界的实体对象时,才使用Object。如果只是需要key: value的数据结构,使用Map结构。

    let map = new Map(arr)

    Map 方法

    • map.keys()
    • map.values()
    • map.entries()

    8. 模块
    模块导入使用 import 代替 require
    模块导出使用 export 代替 module.export。

    如果模块只有一个输出值,就使用 export default,如果模块有多个输出值,就不使用 export default

    如果模块默认输出一个函数,函数名的首字母应该小写。

    const userInfo = () => {
        // ...
    }
    export userInfo
    
    const UserInfo = {
        // ...
    }
    export default UserInfo

    参考: http://es6.ruanyifeng.com/#docs/style

  • 相关阅读:
    JavaSE 基础
    Mybatis(三) 动态SQL
    Java基础(十)
    Java基础(九)
    Java基础(八)
    Java基础(七)
    centos7怎么把语言切换成英语
    CentOS更改yum源与更新系统
    快速切換前後日期
    laravel 框架给数组分页
  • 原文地址:https://www.cnblogs.com/wx1993/p/7495597.html
Copyright © 2011-2022 走看看