学习新对象字面量语法

目标

使用简写属性名称
使用简写方法名称
使用计算属性名称

问题

哪些部分是冗余的?

    const person={name:name,address:address,sayHello:function(){/*......*/},sayName:function(){/*......*/}sayAddress:function(){/*......*/}}
复制代码

简写属性名称

//ES5
const message={text:text} //将属性text赋给text变量//ES6
const message={ text }  //将属性text分配给名为text的变量
复制代码

与解构结合使用

let {count} = stateManger.getState();  // 从转态管理器中检索出count
count+=amount;
stateManger.update({count})  //设置状态管理器中的count // 实际是{count:count} 第一行取出和第三行设置，这种对称性很优雅复制代码

简写方法名称

简写方法会被视为匿名函数，而不是命名函数,这意味着不能通过函数内部的名称来引用函数

 const fn={foo(n){if(n<=2) return 1;return foo(n-1) + foo(n-2)}}fn.foo(7)  //报错，foo未定义
复制代码

只有在函数自引用的情况下，才会有关系，函数就像递归一样引用了自己

const person={sayHello:function sayHello(){console.log(123);}
}
person.sayHello(); //123
复制代码

使用this解决这个问题

//this.foo在函数的上下文中调用，如果被独立开，就没用了
const fn={foo(n){if(n<=2) return 1;return this.foo(n-1) + this.foo(n-2)}
}
const {foo}=fn;
console.log(fn.foo(7));   //13
const fn2={foo};
console.log(fn2.foo(7));  //13
const fn3={f:foo};
console.log(fn3.f(7)); //this.foo is not a function复制代码

函数使用自我引用时，请不要使用简写方法名称

计算属性名称

计算属性允许在对象字面量上使用动态属性名称

const property='color';
const flower={[property]:'red'
}
console.log(flower.property); //undefined
console.log(flower.color); //red
console.log(flower.color); //red复制代码

转载于:https://juejin.im/post/5cfd34a5e51d4550a629b248

学习新对象字面量语法相关推荐

字面量、对象字面量、函数字面量、函数定义
#1.字面量(literal) 用于表达一个固定值的表示法,又叫常量. [JS程序执行到代码中的字面量,会立即知道它是什么类型的数据,值是多少] #2.对象字面量语法: {k1:v1, k2:v2, ...
JavaScript基础07-day09【嵌套for循环、break和continue、对象、数据类型、对象字面量、函数】
学习地址: 谷粒学院--尚硅谷哔哩哔哩网站--尚硅谷最新版JavaScript基础全套教程完整版(140集实战教学,JS从入门到精通) JavaScript基础.高级学习笔记汇总表[尚硅谷最新版Ja ...
对象、对象的属性、对象字面量、枚举对象中的属性、可变类型、变量和对象——JS对象
目录一.对象二.对象的属性三.对象字面量四.枚举对象中的属性五.可变类型六.变量和对象数据类型: 原始值:(不可变类型) 1.数值 Number 2.大整数 BigInt 3.字符串 S ...
js对象字面量属性间相互访问的问题和这个问题与执行环境的关系
对象字面量属性间无法相互访问的问题: 我曾经在定义一个对象时, 并出于复用性的考虑试图复用某些属性: // test 1 var person = {firstName : "Bill&qu ...
JavaScript 对象字面量
目录一. 对象的基本用法二. 遍历对象三. 属性的类型 1. 数据类型 2. 访问浏览器属性 3.定义多个属性 4. 检测属性 5. 对象安全防护(对象拓展,对象密封,对象冻结) 四.对象在实际 ...
Vue 字面量语法 vs 动态语法
初学者常犯的一个错误是使用字面量语法传递数值:  <comp some-prop="1">&l ...
js之字面量、对象字面量的访问、关键字in的用法
一:字面量含义字面量表示如何表达这个值,一般除去表达式,给变量赋值时,等号右边都可以认为是字面量. 字面量分为字符串字面量(string literal ).数组字面量(array literal) ...
const的使用 || 对象增强写法 (对象字面量)
const的使用 <!DOCTYPE html> <html lang="en"> <head><meta charset="U ...
利用对象字面量创建对象
利用对象字面量创建对象 <!DOCTYPE html> <html lang="en"><head><meta charset=" ...

学习新对象字面量语法

目标

问题

简写属性名称

简写方法名称

使用this解决这个问题

计算属性名称

学习新对象字面量语法相关推荐

最新文章

热门文章