乐趣区

关于javascript:对比Map-与-Object

比照 Map 与 Object

键名

/**-------------------- Map --------------------*/
Map 键名能够是任何类型
const map = new Map(
    [[1, '111'],
        ['a', 'aaa'],
        [true, true],
        [{x: 1}, 'object'],
        [null, 'null'],
        [undefined, 'undefined']
    ]
)

/**------------------- Object ------------------*/
Object 键名只能是字符串 (Object 会默认将键名转化为字符串格局)

创立

/**------------------- Map --------------------*/
const map = new Map() // new 关键字创立

/**------------------ Object ------------------*/
const obj = new Object() // new 关键字创立
const obj = {} // 间接赋值
const obj = Object.create() // 应用 create 创立

// 函数式创立
function Person(name, age){
  this.name = name;
  this.age = age;
}
const obj = new Person()

新增元素



/**-------------------- Map --------------------*/
// 创立时塞入汇合整体
const map = new Map(
    [[1, '111'],
        ['a', 'aaa'],
        [true, true]
    ]
)

// 链式设置
const map = new Map()
    .set(1, '111')
    .set('a', 'aaa')
    .set(true, true)
 
 // set 单个设置      
const map = new Map()
map.set(1, '111')
map.set('a', 'aaa')
map.set(true, true)

/**-------------------- Object -------------------*/
// 罕用赋值形式 --> object.key / object[key]
const obj = {}
obj.a = 'aaaa'
obj['1'] = 1111 

// new 关键字创立时塞入对象
const obj = new Object(
    {
        1: '111',
        a: 'aaa',
        true: true
    }
)

// 间接赋值
const obj = {
        1: '111',
        a: 'aaa',
        true: true
    }
    
// 应用 create 创立时塞入对象
const obj = Object.create(
    {
        1: '111',
        a: 'aaa',
        true: true
    }
)

// 函数式创立时,this 指定赋值
function Person(name, age){
  this.name = name;
  this.age = age;
}
const obj = new Person()

获取元素


/**-------------------- Map --------------------*/
const map = new Map(
    [[1, '111'],
        ['a', 'aaa'],
        [true, true]
    ]
)
map.get(1) 
map.get('a')
map.get(true) 

/**-------------------- Object -------------------*/
const obj = {
        1: '111',
        a: 'aaa',
        true: true
    }
obj.a  // object.key
obj[1] // object[key]

删除元素


/**-------------------- Map --------------------*/
const map = new Map(
    [[1, '111'],
        ['a', 'aaa'],
        [true, true]
    ]
)

map.delete('a') // 单个删除
map.clear() // 革除所有元素

/**-------------------- Object -------------------*/
let obj = {
        1: '111',
        a: 'aaa',
        true: true
    }

delete obj[true] // 单个删除
obj = {} // 清空所有元素


判断某个元素是否存在

/**-------------------- Map --------------------*/
const map = new Map(
    [[1, '111'],
        ['a', 'aaa'],
        [true, true]
    ]
)
map.has('a') // 返回布尔值

/**-------------------- Object -------------------*/
let obj = {
        1: '111',
        a: 'aaa',
        true: true
    }

// 返回 undefined 则不存在
obj.a
obj[1]


长度

/**-------------------- Map --------------------*/
const map = new Map()
map.size

/**-------------------- Object -------------------*/
const obj = new Object()
Object.keys(obj).length

遍历办法


/**-------------------- Map --------------------*/
const map = new Map(
    [[1, '111'],
        ['a', 'aaa'],
        [true, true]
    ]
)

// keys
map.keys() // { 1, 'a', true}

// values
map.values() // { '111', 'aaa', true}

// entries
map.entries() // { [ 1, '111'], ['a', 'aaa'], [true, true] }

// forEach
map.forEach((value, key, map) => console.log(value, key, map)
)
// 111 1 Map(3) {1 => '111', 'a' => 'aaa', true => true}
// aaa a Map(3) {1 => '111', 'a' => 'aaa', true => true}
// true true Map(3) {1 => '111', 'a' => 'aaa', true => true}

// for...of 
for (const [key, value] of map) {console.log(key, value) }
// 1 111
// a aaa
// true true

/**-------------------- Object -------------------*/
// for...in
const obj = {
  1: '111',
  a: 'aaa',
  true: true
}

for (const key in obj) {console.log(key)
}
// 1
// a
// true
退出移动版