日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當(dāng)前位置: 首頁 > 前端技术 > javascript >内容正文

javascript

对象认知全提升,成为 JS 高手

發(fā)布時(shí)間:2024/3/12 javascript 40 豆豆
生活随笔 收集整理的這篇文章主要介紹了 对象认知全提升,成为 JS 高手 小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.

1.對象屬性

常規(guī)屬性

  • 鍵為字符串的屬性
  • 根據(jù)創(chuàng)建時(shí)的順序排序
const obj = {};obj.p1 = "p1"; obj.p6 = "p6"; obj.p2 = "p2";for (const p in obj) {console.log("property:", p); }

執(zhí)行結(jié)果:

排序?qū)傩?/h3>
  • 屬性鍵值為數(shù)字或者數(shù)字字符串的屬性
  • 按照索引值大小升序排序
const obj = {};obj[1] = "p1"; obj[6] = "p6"; obj[2] = "p2"; //obj["1"] = "p1"; //obj["6"] = "p6"; //obj["2"] = "p2";for (const p in obj) {console.log("property:", p); }

執(zhí)行結(jié)果:

同時(shí)存在先輸出排序?qū)傩?/p> const obj = {};obj.p1 = "str1"; obj.p6 = "str6"; obj.p2 = "str2";obj[1] = "num1"; obj[6] = "num6"; obj[2] = "num2";for (let p in obj) {console.log("property:", obj[p]); }

執(zhí)行結(jié)果:

為什么要設(shè)計(jì)常規(guī)屬性和排序?qū)傩?/p>

  • 使用兩種線性結(jié)構(gòu)保存(elements、properties),提升V8引擎屬性的訪問速度

2.屬性來源

  • 靜態(tài)屬性,例如: Object.assign
  • 原型屬性,例如: Object.prototype.toString
  • 實(shí)例屬性,例如: function Person (name){ this.name = name }
// 1.函數(shù)作為構(gòu)造實(shí)例 function Person(name, age) {this.name = name;this.age = age;this.getName = function () {return name;}; }Person.prototype.getAge = function () {return this.age; };const person = new Person();// 2.class 實(shí)例對象 class Person {constructor(name, age) {this.name = name;this.age = age;}getName = () => {return this.name;};getAge() {return this.age;} }const hasOwn = Object.hasOwnProperty; const print = console.log;const person = new Person(); print("getName:", hasOwn.call(person, "getName")); // 實(shí)例屬性 print("getAge:", hasOwn.call(person, "getAge")); // 原型屬性// 3.Object.defineProperty const obj = {}; Object.defineProperty(obj, "name", {value: "云牧", });console.log("name:", obj.name);// 云牧

3.屬性描述符

  • Object.defineProperty 、 Object.defineProperties 設(shè)置屬性信息
  • Object.getOwnPropertyDescriptor 、Object.getOwnPropertyDescriptors 獲取屬性描述信息* configurable:可配置(屬性能不能被刪除和重新通過 defineProperty 設(shè)置,但是當(dāng)設(shè)置 writable 和 value 從 true 到 false 則是允許的)* enumerable:是否可枚舉* value:值* writable:是否可被更改* set:訪問器函數(shù)* get:訪問器函數(shù)
  • 數(shù)據(jù)屬性: value + writable + configurable + enumerable
  • 訪問器屬性:get + set + configurable + enumerable

默認(rèn) defineProperty 不傳第三個描述符

const obj = {};Object.defineProperty(obj, "name", {});console.log(obj.name); // undefined 且不能被改寫console.log(Object.getOwnPropertyDescriptor(obj, "name"));

執(zhí)行結(jié)果如下:

Object.defineProperty的缺點(diǎn)

  • 無法監(jiān)聽數(shù)組變化
  • 只能劫持對象的屬性,因此我們需要對對象的每個屬性進(jìn)行遍歷。如果屬性也是對象,還得進(jìn)行遞歸

4.對象限制

1.對象可擴(kuò)展-Object.preventExtensions

  • Object.preventExtensions:對象變的不可擴(kuò)展,也就是永遠(yuǎn)不能再添加新的屬性
  • Object.isExtensible:判斷一個對象是否是可擴(kuò)展
const obj = { name: "張三" };Object.preventExtensions(obj);// 不可以添加新屬性 obj.age = 2;console.log("obj:", obj); // obj: { name: '張三' } console.log(Object.isExtensible(obj)); // false

2.對象的封閉-Object.seal

  • Object.seal:阻止添加新屬性+屬性標(biāo)記為不可配置
  • Object.isSealed:檢查一個對象是否被密封
//2. Object.seal const object1 = {prop1: 11, };Object.seal(object1);// 不可以 添加屬性 object1.prop2 = 22; console.log(object1.prop2); // undefined// 不可以 刪除屬性 delete object1.prop1; console.log(object1.prop1); // 11

3.對象的凍結(jié)- Object.freeze

  • Object.freeze:不加新屬性+不可配置+不能修改值
  • Object.isFrozen:檢查一個對象是否被凍結(jié)
const obj = {prop1: 11, };Object.freeze(obj);// 添加 obj.prop2 = "prop2"; // 修改值 obj.prop1 = 33; // 刪除 delete obj.prop1;Object.defineProperty(obj, "prop1", {value: 10, });console.log(obj.prop1); console.log(obj.prop2); console.log(Object.isFrozen(obj));

4.總結(jié)

方法新增屬性修改描述符刪除屬性更改屬性值
Object.preventExtensionsx
Object.sealxx(修改 writable 為 false 可以)x
Object.freezexx(修改 writable 為 false 可以)xx

5.訪問對象原型

1.prototype

  • prototype是一個對象
  • 原型會形成原型鏈,原型鏈上查找屬性比較耗時(shí),訪問不存在的屬性會訪問整個原型鏈

2._proto_

  • 構(gòu)造函數(shù)的原型
  • null以外的對象均有 _proto_ 屬性
  • Function 、class的實(shí)例有 prototype 以及 _proto_ 屬性
  • 普通函數(shù),祖上第三代上必為null
// 普通函數(shù) function a() {} console.log(a.__proto__.__proto__.__proto__); // null// 作為構(gòu)造函數(shù) function Person() {} const person = new Person(); console.log(person.__proto__.__proto__.__proto__); // null// 普通對象 兩代 const obj = {}; console.log(obj.__proto__.__proto__); // null

3.instanceof

  • 檢測構(gòu)造函數(shù)(右側(cè))的prototype屬性是否出現(xiàn)在某個實(shí)例對象(左側(cè))的原型鏈上
  • Object instanceof Function 、 Function instanceof Object

手寫instanceof

function instanceOf(instance, cclass) {let proto = instance.__proto__;let prototype = cclass.prototype;while (proto) {if (proto === prototype) return true;proto = proto.__proto__;}return false; }class Parent {} class Child extends Parent {} class CChild extends Child {} class Luren {} const cchild = new CChild();console.log(instanceOf(cchild, Parent)); // true console.log(instanceOf(cchild, Child)); // true console.log(instanceOf(cchild, CChild)); // true console.log(instanceOf(cchild, Object)); // true console.log(instanceOf(cchild, Date)); // false console.log(instanceOf(cchild, Luren)); // false

4.getPrototypeOf

  • Object.getPrototypeof() 、 Reflect.getPrototypeOf()* 返回對象的原型
  • 內(nèi)部先toObject轉(zhuǎn)換,注意null和undefined沒有原型

5.setPrototypeOf

  • Object.setPrototypeof() , Reflect.setPrototypeOf()* 指定對象的原型
  • 原型的盡頭是null
const obj = { a: 1 }; console.log(obj.toString());Object.setPrototypeOf(obj, null); // 設(shè)置原型為null console.log(obj.toString()); // obj.toString is not a function

6.isPrototypeOf

  • Object.isPrototypeof 、 Object.prototype.isPrototypeof 、 Reflect.isPrototypeOf 、 Function.isPrototypeOf* 一個對象是否存在于另一個對象的原型鏈上
const print = console.log;print(Object.isPrototypeOf({})); // false print(Object.prototype.isPrototypeOf({})); // true期望左操作數(shù)是一個原型 print(Reflect.isPrototypeOf({})); // false print(Function.isPrototypeOf({})); // false

7.Object.create

  • 使用現(xiàn)有的對象來提供新創(chuàng)建的對象的 __proto__
  • 使用 Object.create(null) 可以創(chuàng)建一個沒有原型的純凈對象

6.對象屬性的遍歷

屬性分類:

  • 普通屬性
  • 原型屬性
  • Symbol屬性
  • 不可枚舉的屬性

遍歷方法:

方法名普通屬性不可枚舉屬性Symbol屬性原型屬性
for inxx
Obiect.keysxxx
Object.getOwnPropertyNamesxx
Object.getOwnPropertySymbolsxx
Reflect.ownKeysx

1.獲取非原型屬性

  • Reflect.ownKeys = Object.getOwnPropertyNames + Object.getOwnPropertySymbols
const symbolSay = Symbol.for("say1");class Person {static flag = "人";static getFlag() {return Person.flag;}static [Symbol.for("symbolPro")]() {return "symbolPro";}constructor(name) {this.name = name;this[symbolSay] = "haha";}getName() {return this.name;}getAge = () => {return 15;}; }function getOwnPropertyStatics(_obj) {const KNOWN_STATICS = {name: true,length: true,prototype: true,caller: true,callee: true,arguments: true,arity: true,};let result = [];let keys = Object.getOwnPropertyNames(_obj);keys = keys.concat(Object.getOwnPropertySymbols(_obj));// const keys = Reflect.ownKeys(_obj)for (let i = 0; i < keys.length; ++i) {const key = keys[i];if (!KNOWN_STATICS[key]) {result.push(key);}}return result; }const staticProps = getOwnPropertyStatics(Person); console.log("非原型屬性:", staticProps); // 非原型屬性: [ 'getFlag', 'flag', Symbol(symbolPro) ]

2.獲取原型上所有屬性

  • Reflect.ownKeys + 遞歸原型鏈
class Grand {gName = "Grand";gGetName() {return this.gName;} } Grand.prototype[Symbol.for("gAge")] = "G-12";class Parent extends Grand {pName = "123";pGetName() {return this.pName;} } Parent.prototype[Symbol.for("pAge")] = "G-11";class Child extends Parent {cName = "123";cGetName() {return this.cName;} }const child = new Child();let result = []; function logAllProperties(instance) {if (instance == null) return;let proto = instance.__proto__;while (proto) {result.push(...Reflect.ownKeys(proto));proto = proto.__proto__;} } logAllProperties(child); console.log("result:", result);

執(zhí)行結(jié)果如下:

3.獲取所有不可枚舉的屬性

const symbolSalary = Symbol.for("ins_symbol_attr_salary");function Person(age, name) {this.ins_in_attr_age = age;this.ins_in_attr_name = name; }const person = new Person(100, "程序員");//Symbol 屬性 person[symbolSalary] = 6000; person["ins_no_enumerable_attr_sex"] = "男";// sex 不可枚舉 Object.defineProperty(person, "ins_no_enumerable_attr_sex", {enumerable: false, });Object.defineProperty(person, symbolSalary, {enumerable: false,value: 999, });// function getNoEnumerable(_obj) {//獲取原型對象const keys = Reflect.ownKeys(_obj);// const result = keys.filter(key=> {// return !Object.getOwnPropertyDescriptor(_obj, key).enumerable// })// return result;const result = keys.filter((key) => {return !Object.prototype.propertyIsEnumerable.call(_obj, key);});return result; }console.log(getNoEnumerable(person));

執(zhí)行結(jié)果如下:

7.對象隱式轉(zhuǎn)換和注意事項(xiàng)

1.顯示轉(zhuǎn)換

  • 通過 JS 轉(zhuǎn)換方法進(jìn)行轉(zhuǎn)換、
  • 比如 String 、 Number 、 parselnt/parseFloat 等

2.隱式轉(zhuǎn)換

  • 編譯器自動完成類型轉(zhuǎn)換的方式就稱為隱式轉(zhuǎn)換,往往預(yù)期和傳入不一致往往就會發(fā)生* 二元 + 運(yùn)算符(類型不一樣的相加)* 關(guān)系運(yùn)算符 >、<、 >=、<=、==* 邏輯! 、if/while ,三目條件* 屬性鍵的遍歷、for in等* 模板字符串

3.對象隱式轉(zhuǎn)換規(guī)則

涉及到三個方法

  • Symbol.toPrimitive* Object.prototype.valueOf* Object.prototype.toString* 如果[Symbol.toPrimitive](hint)方法存在,優(yōu)先調(diào)用,無視valueOf和toSting方法* 否則,如果期望是"string" ——先調(diào)用obj.toString()如果返回不是原始值,繼續(xù)調(diào)用obj.valueOf()* 否則,如果期望是"number"或"default" 先調(diào)用 obj.valueOf() 如果返回不是原始值,繼續(xù)調(diào)用obj.toString()如果未定義[Symbol.toPrimitive](hint),期望string,此時(shí)toString()和valueOf()都沒有返回原始值會拋出異常
const obj = {value: 10,valueOf() {return this;},toString() {return this;}, };console.log(10 + obj); // 報(bào)錯

4.Symbol.toPrimitive(hint)

  • hint - “string”
  • hint - “number”
  • hint - “default”

hint - “string”

  • window.alert(obj)
  • 模板字符串`${obj}
  • test[obj]=123
const obj = {[Symbol.toPrimitive](hint) {if (hint == "number") {return 10;}if (hint == "string") {return "hello";}return true;}, }; // alert, 瀏覽器 // window.alert(obj); // ${} console.log(`${obj}`); // 屬性鍵 obj[obj] = 123; console.log(Object.keys(obj));

執(zhí)行結(jié)果:

hint - “number”

  • 一元+,位移
  • -、*、/ 等關(guān)系運(yùn)算符
  • Math.pow、String、prototype.slice 等很多內(nèi)部方法
const obj = {[Symbol.toPrimitive](hint) {if (hint == "number") {return 10;}if (hint == "string") {return "hello";}return true;}, };// 一元+ console.log("一元+:", +obj);// 位移運(yùn)算符 console.log("位移運(yùn)算符", obj >> 0);// 除減算法, 沒有 + 法,之前已經(jīng)單獨(dú)說過轉(zhuǎn)換規(guī)則 console.log("減法:", 5 - obj); console.log("乘法:", 5 * obj); console.log("除法:", 5 / obj);// 邏輯 大于,小于,大于等于, 沒有等于, 有自己的一套規(guī)則 console.log("大于:", 5 > obj); console.log("大于等于:", 5 >= obj);// 其他期望是整數(shù)的方法 console.log("Math.pow:", Math.pow(2, obj));

執(zhí)行結(jié)果如下:

hint - “default”

  • 二元+
  • == 、!=
const obj = {[Symbol.toPrimitive](hint) {if (hint == "number") {return 10;}if (hint == "string") {return "hello";}return true;}, };console.log("相加:", 5 + obj); // 相加: 6 console.log("等等與:", 5 == obj); // 等等與: false console.log("不等于:", 5 != obj); // 不等于: true

5.ValueOf 和 toString

來幾個小練習(xí)大家自己想想

const user = {name: "John",age: 10,toString() {return this.name;},valueOf() {return this.age;}, };console.log("user:", +user); // user: 10 console.log("user:", `${user}`); // user: John const user = {name: "John",age: 10,toString() {return this.name;},valueOf() {return this;}, };console.log("user:", +user); // NaN // 相當(dāng)于 console.log(+"John"); // NaN const user = {name: "John",age: 10,toString() {return this;},valueOf() {return this.age;}, };Object.prototype.toString = undefined;console.log("user:", `${user}`); // user: 10 const obj = {value: 10,toString: function () {return this.value + 10;},valueOf: function () {return this.value;}, };obj[obj] = obj.value;console.log("keys:", Object.keys(obj)); // keys: [ '20', 'value', 'toString', 'valueOf' ] console.log("${obj}:", `${obj}`); // ${obj}: 20 console.log("obj + 1:", obj + 1); // obj + 1: 11 console.log('obj + "":', obj + ""); // obj + "": 10

特殊Date

  • hint是default ,是優(yōu)先調(diào)用toString,然后調(diào)用valueOf
const date = new Date();console.log("date toString:", date.toString()); console.log("date valueOf:", date.valueOf());console.log(`date str:`, `${date}`); console.log(`date number:`, +date);console.log(`date +:`, date + 1);

執(zhí)行結(jié)果如下:

8.JSON和toJSON

  • 嚴(yán)格意義上JSON對象是不合理,JSON是文本協(xié)議
  • 全局作用域下JSON,名為JSON,是Object對象
  • JSON是一種輕量級的、基于文本的、與語言無關(guān)的語法,用于定義數(shù)據(jù)交換格式
  • 它來源于ECMAScript編程語言,但是獨(dú)立于編程語言

JSON特征

  • JSON就是一串字符串,使用特定的符號標(biāo)注* {}雙括號表示對象* []中括號表示數(shù)組* ""雙引號內(nèi)是屬性鍵或值?### 屬性鍵

  • 只能是字符串

  • 必須雙引號包裹

JSON值

  • object
  • array
  • number(只能十進(jìn)制)
  • string
  • true
  • false
  • null

合格JSON

`["你", "我", "她"]``{ "name": "云牧", "age": 18 }``{ "IDS": ["123", "456"] }``{ "name": null }``{}` `[]`

不合格JSON

` {"name":"云牧",[Symbol.for("sex")]: 1 }`` { name: "云牧", 'age': 32} `` {"name": "云牧","age": undefined }``[-10, 0xDDFF]` ` { "name": "云牧","created": new Date(),"price": 18"getPrice": function() { return this.price;} }`` { "name":"云牧", "age": 32, } `

JSON.stringify()

  • 語法:JSON.stringify(value[, replacer [, space]])
  • 第二個參數(shù)replacer:過濾屬性或者處理值* 如果該參數(shù)是一個數(shù)組:則只有包含在這個數(shù)組中的屬性名才會被序列化到最終的JSON字符串中* 如果該參數(shù)是一個函數(shù)︰則在序列化過程中,被序列化的值的每個屬性都會經(jīng)過該函數(shù)的轉(zhuǎn)換和處理* 如果該參數(shù)為null或者未提供:,則對象所有的屬性都會被序列化
  • 第三個參數(shù)space:美化輸出格式
const person1 = {name: "云牧",age: 18,birth: "2002-01-01", };//replacer 數(shù)組 console.log(JSON.stringify(person1, ["name", "age"])); // {"name":"云牧","age":18}const person2 = {name: "云牧",age: 18,birth: "2002-01-01", };//replacer 方法 const jsonString = JSON.stringify(person2, function (key, value) {if (typeof value === "string") {return undefined;}return value; });console.log(jsonString); // {"age":18}// space 美化格式 const person3 = {name: "云牧",age: 18,birth: "2002-01-01", }; const a = JSON.stringify(person3); console.log(a); // {"name":"云牧","age":18,"birth":"2002-01-01"}const person4 = {name: "云牧",age: 18,birth: "2002-01-01", }; const c = JSON.stringify(person4, null, "\t"); console.log(c); // { // "name": "云牧", // "age": 18, // "birth": "2002-01-01" // }

序列化undefined、任意的函數(shù)、symbol

  • 作為對象屬性值,自動忽略
  • 作為數(shù)組,序列化返回null
  • 單獨(dú)序列化時(shí),返回undefined

其他規(guī)則

  • Date返回 ISO 字符串
  • 循環(huán)引用報(bào)錯
  • NaN、Infinity、null都會作為null
  • Biglnt報(bào)錯
  • Map、Set、WeakMap等對象,僅序列化可枚舉屬性
// 自動忽略 const data1 = {a: "test1",b: undefined,c: Symbol("test2"),fn: function () {return true;}, }; console.log(JSON.stringify(data1)); // {"a":"test1"}//數(shù)組返回null const data2 = ["test1",undefined,function aa() {return true;},Symbol("test2"), ]; console.log(JSON.stringify(data2)); // ["test1",null,null,null]//返回undefined const a1 = JSON.stringify(function a() {console.log("test1"); }); console.log("a1:", a1); // a1: undefined const a2 = JSON.stringify(undefined); console.log("a2:", a2); // a2: undefined const a3 = JSON.stringify(Symbol("test2")); console.log("a3:", a3); // a3: undefined// Date console.log(JSON.stringify({ now: new Date() })); // {"now":"2022-09-12T00:17:54.812Z"}// NaN 和 Infinity 以及null console.log(JSON.stringify(NaN)); // null console.log(JSON.stringify(Infinity)); // null console.log(JSON.stringify(null)); // null//轉(zhuǎn)換為對應(yīng)的原始值。 console.log(JSON.stringify([new Number(2), new String("test"), new Boolean(false)])); // [2,"test",false]//僅序列化可枚舉屬性 const a = JSON.stringify(Object.create(null, {test1: { value: "test1", enumerable: false },test2: { value: "test2", enumerable: true },}) ); console.log(a); // {"test2":"test2"}// BigInt 報(bào)錯 // const c = { // test: 1n, // }; // console.log(JSON.stringify(c));

JSON.parse()

  • 注意:第二個參數(shù)函數(shù)reviver ( k, v )* k代表屬性鍵,v代表屬性值,如果返回undefined則會從當(dāng)前的屬性刪除
const jsonStr = `{ "name": "帥哥", "age":18, "isFans": true,"IDCard": "xxxxxxxxxxxxxxxxxx" } `; // 保密身份證 const obj = JSON.parse(jsonStr, function (key, value) {if (key == "IDCard") {return undefined;} else {return value;} });console.log(obj); // { name: '帥哥', age: 18, isFans: true }

注意:遍歷順序

const jsonStr = `{"name": "牙膏","count": 10, "orderDetail": {"createTime": 1632996519781,"orderId": 8632996519781,"more": {"desc": "描述"}} }`;JSON.parse(jsonStr, function (k, v) {console.log("key:", k);return v; });

執(zhí)行結(jié)果如下:

注意:this

const jsonStr = `{"name": "云牧","orderDetail": {"createTime": 1632996519781} }`;JSON.parse(jsonStr, function (k, v) {console.log("key:", k, ",this:", this);return v; });

執(zhí)行結(jié)果如下:

toJSON

  • 對象擁有toJSON方法,toJSON會覆蓋對象默認(rèn)的序列化行為
const product = {name: "牙膏",orderDetail: {createTime: 1632996519781,},toJSON() {return {name: "云牧",};}, };console.log(JSON.stringify(product)); // '{"name":"云牧"}'

使用場景

  • 請求接口發(fā)送數(shù)據(jù),接收數(shù)據(jù)
  • 本地存儲
  • 深克隆對象

9.學(xué)習(xí)自檢

題目一

const obj = {},objA = { propertyA: "A" },objB = { propertyB: "B" };obj[objA] = "objectA"; obj[objB] = "ObjectB";for (let [p, v] of Object.entries(obj)) {console.log("p:", p, ", v:", v); }

執(zhí)行結(jié)果:

  • Object.entires :迭代器,能獲取鍵值對
  • 對象鍵的特性∶本質(zhì)上是字符串,如果是數(shù)字,轉(zhuǎn)換字符串
  • 隱式轉(zhuǎn)換︰對象的隱式轉(zhuǎn)換,Symbol.toPrimitive,valueOf,toString()
const obj = {},objA = {propertyA: "A",toString() {return "objA";},},objB = {propertyB: "B",valueOf() {return "objB";},};obj[objA] = "objectA"; obj[objB] = "ObjectB";for (let [p, v] of Object.entries(obj)) {console.log("p:", p, ", v:", v); // 優(yōu)先調(diào)用toString // p: objA , v: objectA // p: [object Object] , v: ObjectB }

題目二

const person = {name: "二哈", }; const person2 = Object.create(person); delete person2.name;console.log(person2.name);

執(zhí)行結(jié)果:

題目三

const val = (+{} + [])[+[]]; console.log(val);/*(+{} + [])[+[]] // +{}=> NaN (NaN + [])[+[]] // [] 隱式轉(zhuǎn)換 '' (NaN + '')[+[]] // NaN + '' => 'NaN' ('NaN')[+[]] // +[] => 0 ('NaN')[0] // 'N'*/

題目四

const proto = {name: "原型",arr: [1, 2], }; const person = Object.create(proto); person.name = "實(shí)例"; person.arr.push(3);console.log(person.name); console.log(proto.name);console.log(person.arr); console.log(proto.arr);

執(zhí)行結(jié)果:

題目五

const toString = Object.prototype.toString; function getObjectType(obj) {return toString.call(obj).slice(8, -1); } const obj = String.prototype; console.log(typeof obj); console.log(getObjectType(obj));

執(zhí)行結(jié)果:

題目六

let a = { n: 1 }; a.x = a = { n: 2 };// 求a.x console.log(a.x);

執(zhí)行結(jié)果:

題目七

const proto = {name: "p_parent",type: "p_object",[Symbol.for("p_address")]: "地球", };const ins = Object.create(proto); Object.defineProperty(ins, "age", {value: 18, }); ins.sex = 1; ins[Symbol.for("say")] = function () {console.log("say"); };const inKeys = []; for (let p in ins) {inKeys.push(p); }console.log(inKeys); console.log(Reflect.ownKeys(ins));

執(zhí)行結(jié)果:

最后

整理了一套《前端大廠面試寶典》,包含了HTML、CSS、JavaScript、HTTP、TCP協(xié)議、瀏覽器、VUE、React、數(shù)據(jù)結(jié)構(gòu)和算法,一共201道面試題,并對每個問題作出了回答和解析。

有需要的小伙伴,可以點(diǎn)擊文末卡片領(lǐng)取這份文檔,無償分享

部分文檔展示:



文章篇幅有限,后面的內(nèi)容就不一一展示了

有需要的小伙伴,可以點(diǎn)下方卡片免費(fèi)領(lǐng)取

總結(jié)

以上是生活随笔為你收集整理的对象认知全提升,成为 JS 高手的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯,歡迎將生活随笔推薦給好友。