Object.assign()用法講解

// 將所有可枚舉屬性的值從一個(gè)或多個(gè)源對(duì)象復(fù)制到目標(biāo)對(duì)象。它將返回目標(biāo)對(duì)象驹暑。

? ? ? const target = {a: 1, b: 2}

? ? ? const source = {b: 4, c: 5}

? ? ? const returnedTarget = Object.assign(target, source)

? ? ? // output: Object { a: 1, b: 4, c: 5 }

? ? ? console.log(target)

? ? ? // output: Object { a: 1, b: 4, c: 5 }

? ? ? console.log(returnedTarget)

? ? ? // 淺拷貝復(fù)制對(duì)象 Object.assign()拷貝的是屬性值。假如源對(duì)象的屬性值是一個(gè)對(duì)象的引用,那么它也只指向那個(gè)引用

? ? ? const obj = {a: 1}

? ? ? const copy = Object.assign({}, obj)

? ? ? // { a: 1 }

? ? ? console.log(copy)

? ? ? // 合并對(duì)象

? ? ? const o1 = {a: 1}

? ? ? const o2 = {b: 2}

? ? ? const o3 = {c: 3}

? ? ? const obj1 = Object.assign(o1, o2, o3)

? ? ? console.log(obj1) // { a: 1, b: 2, c: 3 }

? ? ? console.log(o1)? // { a: 1, b: 2, c: 3 }, 注意目標(biāo)對(duì)象自身也會(huì)改變。

? ? ? // 合并具有相同屬性的對(duì)象

? ? ? const o11 = {a: 1, b: 1, c: 1}

? ? ? const o22 = {b: 2, c: 2}

? ? ? const o33 = {c: 3}

? ? ? const obj2 = Object.assign({}, o11, o22, o33)

? ? ? console.log(obj2) // { a: 1, b: 2, c: 3 }

? ? ? // 創(chuàng)建一個(gè)新對(duì)象

? ? ? const person = {

? ? ? ? isHuman: false,

? ? ? ? printIntroduction: function () {

? ? ? ? ? console.log(`My name is ${this.name}. Am I human? ${this.isHuman}`)

? ? ? ? }

? ? ? }

? ? ? const me = Object.create(person)

? ? ? me.name = 'Matthew' // "name" is a property set on "me", but not on "person"

? ? ? me.isHuman = true // inherited properties can be overwritten

? ? ? me.printIntroduction()

? ? ? // entries返回一個(gè)給定對(duì)象自身可枚舉屬性的鍵值對(duì)數(shù)組

? ? ? const obj = {

? ? ? ? a: 'somestring',

? ? ? ? b: 42

? ? ? }

? ? ? for (let [key, value] of Object.entries(obj)) {

? ? ? ? console.log(`${key}: ${value}`)

? ? ? }

? ? ? console.log(obj)

? ? ? // 可以將 Map 轉(zhuǎn)化為 Object

? ? ? const map = new Map([['foo', 'bar'], ['baz', 42]])

? ? ? const obj = Object.fromEntries(map)

? ? ? // { foo: "bar", baz: 42 }

? ? ? console.log(obj)

? ? ? // 可以將 Array 轉(zhuǎn)化為 Object

? ? ? const arr = [['0', 'a'], ['1', 'b'], ['2', 'c']]

? ? ? const obj2 = Object.fromEntries(arr)

? ? ? // { 0: "a", 1: "b", 2: "c" }

? ? ? console.log(obj2)

? ? ? const obj = {

? ? ? ? prop: 42

? ? ? }

? ? ? // 被凍結(jié)的對(duì)象再也不能被修改 不能向這個(gè)對(duì)象添加新的屬性坎匿,不能刪除已有屬性,

? ? ? // 不能修改該對(duì)象已有屬性的可枚舉性雷激、可配置性替蔬、可寫性,以及不能修改已有屬性的值屎暇。

? ? ? // 此外承桥,凍結(jié)一個(gè)對(duì)象后該對(duì)象的原型也不能被修改 freeze() 返回和傳入的參數(shù)相同的對(duì)象

? ? ? Object.freeze(obj)

? ? ? obj.prop = 33

? ? ? console.log(obj.prop)

? ? ? // 判斷兩個(gè)值是否是相同的值

? ? ? let l = Object.is('foo', 'foo')

? ? ? console.log(l)

? ? ? // simple array

? ? ? var arr = ['a', 'b', 'c']

? ? ? console.log(Object.keys(arr)) // console: ['0', '1', '2']

? ? ? // array like object

? ? ? var obj = {0: 'a', 1: 'b', 2: 'c'}

? ? ? console.log(Object.keys(obj)) // console: ['0', '1', '2']

? ? ? // array like object with random key ordering

? ? ? var anObj = {100: 'a', 2: 'b', 7: 'c'}

? ? ? console.log(Object.keys(anObj)) // console: ['2', '7', '100']

? ? ? var obj = {foo: 'bar', baz: 42}

? ? ? console.log(Object.values(obj)) // ['bar', 42]

? ? ? // array like object

? ? ? var obj = {0: 'a', 1: 'b', 2: 'c'}

? ? ? console.log(Object.values(obj)) // ['a', 'b', 'c']

? ? ? // array like object with random key ordering

? ? ? // when we use numeric keys, the value returned in a numerical order according to the keys

? ? ? var an_obj = {100: 'a', 2: 'b', 7: 'c'}

? ? ? console.log(Object.values(an_obj)) // ['b', 'c', 'a']

? ? ? // valueOf() 方法返回指定對(duì)象的原始值

? ? ? // Array:返回?cái)?shù)組對(duì)象本身

? ? ? let array = ['ABC', true, 12, -5]

? ? ? // true

? ? ? console.log(array.valueOf() === array)

? ? ? // Date:當(dāng)前時(shí)間距1970年1月1日午夜的毫秒數(shù)

? ? ? let date = new Date(2013, 7, 18, 23, 11, 59, 230)

? ? ? // 1376838719230

? ? ? console.log(date.valueOf())

? ? ? // Number:返回?cái)?shù)字值

? ? ? let num = 15.26540

? ? ? // 15.2654

? ? ? console.log(num.valueOf())

? ? ? // 布爾:返回布爾值true或false

? ? ? let bool = true

? ? ? // true

? ? ? console.log(bool.valueOf() === bool)

? ? ? // new一個(gè)Boolean對(duì)象

? ? ? let newBool = new Boolean(true)

? ? ? // valueOf()返回的是true,兩者的值相等

? ? ? // true

? ? ? console.log(newBool.valueOf() == newBool)

? ? ? // 但是不全等恭垦,兩者類型不相等快毛,前者是boolean類型,后者是object類型

? ? ? // false

? ? ? console.log(newBool.valueOf() === newBool)

? ? ? /**

? ? ? * apply() 方法調(diào)用一個(gè)具有給定this值的函數(shù)番挺,以及作為一個(gè)數(shù)組(或類似數(shù)組對(duì)象)提供的參數(shù)。

? ? ? * call()方法的作用和 apply() 方法類似屯掖,區(qū)別就是call()方法接受的是參數(shù)列表玄柏,而apply()方法接受的是一個(gè)參數(shù)數(shù)組

? ? ? **/

? ? ? var numbers = [5, 6, 2, 3, 7]

? ? ? var max = Math.max.apply(null, numbers)

? ? ? console.log(max)

? ? ? var min = Math.min.apply(null, numbers)

? ? ? console.log(min)

? ? ? // 用 apply 將數(shù)組添加到另一個(gè)數(shù)組

? ? ? var array = ['a', 'b']

? ? ? var elements = [0, 1, 2]

? ? ? array.push.apply(array, elements)

? ? ? console.info(array) // ["a", "b", 0, 1, 2]

? ? ? /**

? ? ? * 使用 call 方法調(diào)用父構(gòu)造函數(shù)

? ? ? * */

? ? ? function Product(name, price) {

? ? ? ? this.name = name

? ? ? ? this.price = price

? ? ? }

? ? ? function Food(name, price) {

? ? ? ? Product.call(this, name, price)

? ? ? ? this.category = 'food'

? ? ? }

? ? ? function Toy(name, price) {

? ? ? ? Product.call(this, name, price)

? ? ? ? this.category = 'toy'

? ? ? }

? ? ? var cheese = new Food('feta', 5)

? ? ? var fun = new Toy('robot', 40)

? ? ? console.log(cheese)

? ? ? console.log(fun)

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市贴铜,隨后出現(xiàn)的幾起案子粪摘,更是在濱河造成了極大的恐慌,老刑警劉巖绍坝,帶你破解...
    沈念sama閱讀 222,464評(píng)論 6 517
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件徘意,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡轩褐,警方通過查閱死者的電腦和手機(jī)椎咧,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,033評(píng)論 3 399
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人勤讽,你說我怎么就攤上這事蟋座。” “怎么了脚牍?”我有些...
    開封第一講書人閱讀 169,078評(píng)論 0 362
  • 文/不壞的土叔 我叫張陵向臀,是天一觀的道長(zhǎng)。 經(jīng)常有香客問我诸狭,道長(zhǎng)券膀,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 59,979評(píng)論 1 299
  • 正文 為了忘掉前任驯遇,我火速辦了婚禮芹彬,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘妹懒。我一直安慰自己雀监,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 69,001評(píng)論 6 398
  • 文/花漫 我一把揭開白布眨唬。 她就那樣靜靜地躺著会前,像睡著了一般。 火紅的嫁衣襯著肌膚如雪匾竿。 梳的紋絲不亂的頭發(fā)上瓦宜,一...
    開封第一講書人閱讀 52,584評(píng)論 1 312
  • 那天,我揣著相機(jī)與錄音岭妖,去河邊找鬼临庇。 笑死,一個(gè)胖子當(dāng)著我的面吹牛昵慌,可吹牛的內(nèi)容都是我干的假夺。 我是一名探鬼主播,決...
    沈念sama閱讀 41,085評(píng)論 3 422
  • 文/蒼蘭香墨 我猛地睜開眼斋攀,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼已卷!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起淳蔼,我...
    開封第一講書人閱讀 40,023評(píng)論 0 277
  • 序言:老撾萬榮一對(duì)情侶失蹤侧蘸,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后鹉梨,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體讳癌,經(jīng)...
    沈念sama閱讀 46,555評(píng)論 1 319
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,626評(píng)論 3 342
  • 正文 我和宋清朗相戀三年存皂,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了晌坤。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 40,769評(píng)論 1 353
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖泡仗,靈堂內(nèi)的尸體忽然破棺而出埋虹,到底是詐尸還是另有隱情,我是刑警寧澤娩怎,帶...
    沈念sama閱讀 36,439評(píng)論 5 351
  • 正文 年R本政府宣布搔课,位于F島的核電站,受9級(jí)特大地震影響截亦,放射性物質(zhì)發(fā)生泄漏爬泥。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 42,115評(píng)論 3 335
  • 文/蒙蒙 一崩瓤、第九天 我趴在偏房一處隱蔽的房頂上張望袍啡。 院中可真熱鬧,春花似錦却桶、人聲如沸境输。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,601評(píng)論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽嗅剖。三九已至,卻和暖如春嘁扼,著一層夾襖步出監(jiān)牢的瞬間信粮,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,702評(píng)論 1 274
  • 我被黑心中介騙來泰國(guó)打工趁啸, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留强缘,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 49,191評(píng)論 3 378
  • 正文 我出身青樓不傅,卻偏偏與公主長(zhǎng)得像旅掂,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子访娶,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,781評(píng)論 2 361

推薦閱讀更多精彩內(nèi)容