对象初始化
产生一个空对象
//es5
var a = new Object()
var a = {}
//es6
let a = Object.creat(null) //真正的空对象,原型链没有链上Object.prototpe
let b = Object.creat(Object.prototype)
复制代码
属性定义
如果key和value相同那么可以简写
let a = 1
let b = 2
let obj = {a,b}//等于let obj={a:a,b:b}
复制代码
计算属性名
对象初始化语法开始支持计算属性名。其允许在[]中放入表达式,计算结果可以当做属性名。这种用法和用方括号访问属性非常类似,也许你已经用来读取和设置属性了。现在同样的语法也可以用于对象字面值了
let name = 'bibi'
let person = {[name]:666} //{bibi:666}
复制代码
方法定义
对象属性也可以是一个函数、getter、setter方法。有点像vue computed里面的getter和setter
var bibi = {
_age: 18,
get age() {
return bibi._age
},
set age(val) {
if (val < 100) {
bibi._age = val
} else {
bibi._age = 100
}
}
}
复制代码
如何实现a === 1 && a === 2 && a === 3 ?
用get劫持
var i = 0
Object.defineProperty(window,'a',{
get(){
i += 1
return i
}
})
a === 1 && a === 2 && a === 3
//true
复制代码
浅拷贝
var a = {a:1,b:2,c:3}
var b = Object.assign({},a)
或者
var a = {a:1,b:2,c:3}
var b = {...a}
复制代码
属性修饰符
Object.defineproperty
如果你想给一个已经定义了属性的对象添加getter,setter,那么就可以使用Object.defineproperty,顺便说一下,vue的响应式就是通过Object.defineproperty对所有的属性进行劫持,把它们全部转化为getter和setter
var oldObj = {a:1,b:2}
Object.defineproperty(oldObj,'c',{
get (){},
set (val){}
})
复制代码
属性描述符
对象里目前存在的属性描述符有两种主要形式:数据描述符和存取描述符。数据描述符是一个具有值的属性,该值可能是可写的,也可能不是可写的。存取描述符是由getter-setter函数对描述的属性。描述符必须是这两种形式之一;不能同时是两者。
- 数据描述符和存取描述符均具有以下可选键值:
- configurable 当且仅当该属性的 configurable 为 true 时,该属性描述符才能够被改变,同时该属性也能从对应的对象上被删除。默认为 false。
//如果configurable为true,这个属性的除writable属性描述符才能更改 - enumerable 当且仅当该属性的enumerable为true时,该属性才能够出现在对象的枚举属性中。默认为 false。
//如果enumerable为true,那么for...in
和Object.keys()
就能够遍历到这个属性
2. 数据描述符同时具有以下可选键值:
- value 该属性对应的值。可以是任何有效的 JavaScript 值(数值,对象,函数等)。默认为 undefined。
- writable 当且仅当该属性的writable为true时,value才能被赋值运算符改变。默认为 false。 //如果writable为false,那么这个属性将不可写,但是并不会报错
3. 存取描述符同时具有以下可选键值:
- get 一个给属性提供 getter 的方法,如果没有 getter 则为 undefined。该方法返回值被用作属性值。默认为 undefined。
- set 一个给属性提供 setter 的方法,如果没有 setter 则为 undefined。该方法将接受唯一参数,并将该参数的新值分配给该属性。默认为 undefined。
Object.getOwnPropertyDescriptor()
Object.getOwnPropertyDescriptor(obj, prop)
方法返回指定对象上一个自有属性对应的属性描述符。(自有属性指的是直接赋予该对象的属性,不需要从原型链上进行查找的属性)
o = { bar: 42 }
d = Object.getOwnPropertyDescriptor(o, "bar")
// d {
// configurable: true,
// enumerable: true,
// value: 42,
// writable: true
// }
复制代码
Object.getOwnPropertyNames()
Object.getOwnPropertyNames()方法返回一个由指定对象的所有自身属性的属性名(包括不可枚举属性但不包括Symbol值作为名称的属性)组成的数组。
var arr = ["a", "b", "c"];
console.log(Object.getOwnPropertyNames(arr).sort()); // ["0", "1", "2", "length"]
复制代码
模块
export
命名导出
function cube(x) {
return x * x * x
}
const foo = 'b'
export { cube,foo }
//这样的话,在其它脚本 (比如import),我们可以这样使用
import { cube, foo } from 'my-module.js'
//如果你要import引入的话那么名称必须相同,必须使用相应对象的相同名称。
复制代码
默认导出
//只能有一个默认导出
export default function cube(x) {
return x * x * x;
}
import zxczxczxczxc from 'my-module'
//这个名称可以随意更改
复制代码
import
import {foo, bar} from '/modules/my-module.js'
import '/modules/my-module.js'
//模块仅为副作用(中性词,无贬义含义)而导入,而不导入模块中的任何内容。 这将运行模块中的全局代码, 但实际上不导入任何值。
import {exportName as newName} from '/modules/my-module.js'
//导入时可以重命名导出。例如,newName。
import * as bibi from '/modules/my-module.js'
//这将bibi插入当前作用域,其中包含来自位于/modules/my-module.js文件中导出的所有模块。
//在这里,访问导出意味着使用模块名称(在这种情况下为“bibi”)作为命名空间。例如,如果上面导入的模块包含一个paly(),你可以这样调用:
bibi.play()
复制代码