2024年Web前端最新这 6 点知识让我对 JavaScript 的对象有了更进一步的了解，知乎上转疯了

文末

技术是没有终点的，也是学不完的，最重要的是活着、不秃。

零基础入门的时候看书还是看视频，我觉得成年人，何必做选择题呢，两个都要。喜欢看书就看书，喜欢看视频就看视频。

最重要的是在自学的过程中，一定不要眼高手低，要实战，把学到的技术投入到项目当中，解决问题，之后进一步锤炼自己的技术。

自学最怕的就是缺乏自驱力，一定要自律，杜绝“三天打鱼两天晒网”，到最后白忙活一场。

高度自律的同时，要保持耐心，不抛弃不放弃，切勿自怨自艾，每天给自己一点点鼓励，学习的劲头就会很足，不容易犯困。

技术学到手后，找工作的时候一定要好好准备一份简历，不要无头苍蝇一样去海投简历，容易“竹篮打水一场空”。好好的准备一下简历，毕竟是找工作的敲门砖。

拿到面试邀请后，在面试的过程中一定要大大方方，尽力把自己学到的知识舒适地表达出来，不要因为是自学就不够自信，给面试官一个好的印象，面试成功的几率就会大很多，加油吧，骚年！

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

Array.prototype);

输出：

true

true

Object.create 创建具有特定原型的对象

• protoRabbit充当所有兔子共享的属性的容器

• 单个兔子对象（如杀手兔子）包含仅适用于自身的属性（在本例中为type），并从其原型派生共享属性

let protoRabbit = {

speak: function (line) {

console.log(${this.type}兔子说：${line} );

}

}

let killerRabbit = Object.create(protoRabbit)

killerRabbit.type = ‘杀手’

killerRabbit.speak(‘准备受死吧！’)

输出：

杀手兔子说：准备受死吧！

3.构造函数

---

— 构造函数原型

• 创建从某个共享原型派生的对象的更方便的方法是使用构造函数

• 在 JavaScript 中，调用前面带有new关键字的函数会将其视为构造函数

• 构造函数将其this变量绑定到一个新对象，除非它显式返回另一个对象值，否则此新对象将从调用中返回

• 用new创建的对象被称为是其构造函数的实例

• 约定将构造函数的名称大写，以便于与其他函数区分开

function Rabbit(type) {

this.type = type;

}

let killerRabbit = new Rabbit(“killer”);

let blackRabbit = new Rabbit(“black”);

console.log(blackRabbit.type);

输出：

black

— 默认情况下，构造函数具有Object.prototype

• 构造函数（实际上是所有函数）会自动获取一个名为prototype的属性，默认情况下，该属性包含一个从Object.prototype派生的普通空对象

• 使用此构造函数创建的每个实例都将此对象作为其原型

function Rabbit(type) {

this.type = type;

}

let blackRabbit = new Rabbit(“黑色”);

Rabbit.prototype.speak = function(line) {

console.log(${this.type}的兔子说：${line} );

};

blackRabbit.speak(“Boom…一波王炸！”);

输出：

黑色的兔子说：Boom…一波王炸！

4. 重写派生属性

---

— 相同的原型名称

• 如果原型中有同名的属性，则不会更改此属性

• 该属性被添加到对象本身

function Rabbit(type) {

this.type = type;

}

let blackRabbit = new Rabbit(“black”);

let killerRabbit = new Rabbit(“killer”);

Rabbit.prototype.teeth = “small”;

console.log(killerRabbit.teeth);

// small

killerRabbit.teeth = “long, sharp, and bloody”;

console.log(killerRabbit.teeth);

// long, sharp, and bloody

console.log(blackRabbit.teeth);

// small

console.log(Rabbit.prototype.teeth);

// small

下面 console.log(blackRabbit.teeth)的结果是small，因为blackRabbit对象不具有teeth属性，它继承自Rabbit对象自己的teeth属性，值为 small。

5. 原型的干扰

---

— 可枚举与不可枚举

let map = {}

function storePhi(event, phi) {

map[event] = phi

}

storePhi(‘pizza’, 0.069)

storePhi(‘touched tree’, -0.081)

Object.prototype.nonsense = ‘hi’

for(let name in map) {

console.log(name)

}

console.log(‘nonsense’ in map)

console.log(‘toString’ in map)

输出结果:

pizza

touched tree

nonsense

true

true

toString没有出现在for/in循环中，但是in运算符中返回true，这是因为 JS 区分可枚举属性和不可枚举属性。

我们通过简单分配创建的所有属性都是可枚举的，Object.prototype中的标准属性都是不可改变的，这就是为什么它们不出现在这样的for/in循环中的原因。

let map = {};

function storePhi(event, phi) {

map[event] = phi;

}

storePhi(“pizza”, 0.069);

storePhi(“touched tree”, -0.081);

Object.defineProperty(Object.prototype, “hiddenNonsense”,

{enumerable: false, value: “hi”})

for (var name in map) {

console.log(name)

}

console.log(map.hiddenNonsense)

输出：

pizza

touched tree

hi

通过使用Object.defineproperty函数可以定义自己的不可枚举属性，该函数允许我们控制要创建的属性的类型，在该示例中，hiddenNonsense在 map 中，但在 for...in 中不会显示。

— hasOwnProperty vs in 操作符

const map = {}

console.log(“toString” in map)

console.log(map.hasOwnProperty(“toString”))

输出：

true

false

hasOwnProperty方法告诉我们对象本身是否具有该属性，而无需查看其原型,这通常是比in运算符提供给我们的信息更有用的信息。

因此，如果你对基础对象原型感到困惑时，建议你可以这样写for/in循环:

文末

逆水行舟不进则退，所以大家要有危机意识。

同样是干到35岁，普通人写业务代码划水，榜样们深度学习拓宽视野晋升管理。

这也是为什么大家都说35岁是程序员的门槛，很多人迈不过去，其实各行各业都是这样都会有个坎，公司永远都缺的高级人才，只用这样才能在大风大浪过后，依然闪耀不被公司淘汰不被社会淘汰。

为了帮助大家更好温习重点知识、更高效的准备面试，特别整理了《前端工程师核心知识笔记》电子稿文件。

内容包括html，css，JavaScript，ES6，计算机网络，浏览器，工程化，模块化，Node.js，框架，数据结构，性能优化，项目等等。

269页《前端大厂面试宝典》

包含了腾讯、字节跳动、小米、阿里、滴滴、美团、58、拼多多、360、新浪、搜狐等一线互联网公司面试被问到的题目，涵盖了初中级前端技术点。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

前端面试题汇总