写点什么

Vue 中 const 命令

作者:默默的成长
  • 2022-10-14
    山东
  • 本文字数:1088 字

    阅读完需:约 4 分钟



const 命令

  • 请记得 const 和 let 都是块级作用域,var 是函数级作用域


// const and let only exist in the blocks they are defined in.{  let a = 1  const b = 1}console.log(a) // ReferenceErrorconsole.log(b) // ReferenceError
复制代码


对所有引用都使用 const,不要使用 var,eslint: prefer-const, no-const-assign 原因:这样做可以确保你无法重新分配引用,以避免出现错误和难以理解的代码


// badvar a = 1var b = 2
// goodconst a = 1const b = 2
复制代码


如果引用是可变动的,使用 let 代替 var,eslint: no-var 原因:let 是块级作用域的,而不像 var 属于函数级作用域


// badvar count = 1if (count < 10) {  count += 1}
// goodlet count = 1if (count < 10) { count += 1}
复制代码

对象

请使用字面量值创建对象,eslint: no-new-object


// badconst a = new Object{}
// goodconst a = {}别使用保留字作为对象的键值,这样在 IE8 下不会运行
// badconst a = { default: {}, // default 是保留字 common: {}}
// goodconst a = { defaults: {}, common: {}}
复制代码


当使用动态属性名创建对象时,请使用对象计算属性名来进行创建 原因:因为这样做就可以让你在一个地方定义所有的对象属性


function getKey(k) {  return `a key named ${k}`}
// badconst obj = { id: 5, name: 'San Francisco'};obj[getKey('enabled')] = true
// goodconst obj = { id: 5, name: 'San Francisco', [getKey('enabled')]: true};
复制代码


请使用对象方法的简写方式,eslint: object-shorthand


// badconst item = {  value: 1,
addValue: function (val) { return item.value + val }}
// goodconst item = { value: 1,
addValue (val) { return item.value + val }}
复制代码


请使用对象属性值的简写方式,eslint: object-shorthand 原因:这样更简短且描述更清楚


const job = 'FrontEnd'
// badconst item = { job: job}
// goodconst item = { job}
复制代码


将简写的对象属性分组后统一放到对象声明的开头 原因:这样更容易区分哪些属性用了简写的方式


只对非法标识符的属性使用引号,eslint: quote-props 原因:因为通常来说我们认为这样主观上会更容易阅读,这样会带来代码高亮上的提升,同时也更容易被主流 JS 引擎优化


不要直接使用 Object.prototype 的方法, 例如 hasOwnProperty, propertyIsEnumerable 和 isPrototypeOf 方法,eslint: no-prototype-builtins 原因:这些方法可能会被对象自身的同名属性覆盖 - 比如 { hasOwnProperty: false } 或者对象可能是一个 null 对象(Object.create(null))

用户头像

还未添加个人签名 2022-10-11 加入

还未添加个人简介

评论

发布
暂无评论
Vue 中const 命令_前端_默默的成长_InfoQ写作社区