首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >在Object.create的proto参数中使用时,什么是对象与Object.prototype

在Object.create的proto参数中使用时,什么是对象与Object.prototype
EN

Stack Overflow用户
提问于 2017-10-21 12:16:18
回答 2查看 1.2K关注 0票数 9

我正在尝试理解Object和Object.prototype之间的区别。因为要创建一个空对象,需要使用Object.prototype。我觉得为什么不反对。

我将通过以下方式创建一个对象。

方法1:

代码语言:javascript
运行
AI代码解释
复制
o = Object.create(Object.prototype,{ p : {value: "test"} });
console.log(o.__proto__);

结果是:

代码语言:javascript
运行
AI代码解释
复制
Object {__defineGetter__: function, __defineSetter__: function, hasOwnProperty: function, __lookupGetter__: function, __lookupSetter__: function}

代码语言:javascript
运行
AI代码解释
复制
console.log(o)

结果是

代码语言:javascript
运行
AI代码解释
复制
Object {p: "test"}
    p : "test"
    __proto__ : Object
        constructor : function Object()
        hasOwnProperty : function hasOwnProperty()
        isPrototypeOf : function isPrototypeOf()
        propertyIsEnumerable : function propertyIsEnumerable()
        toLocaleString : function toLocaleString()
        toString : function toString()
        valueOf : function valueOf()
        __defineGetter__ : function __defineGetter__()
        __defineSetter__ : function __defineSetter__()
        __lookupGetter__ : function __lookupGetter__()
        __lookupSetter__ : function __lookupSetter__()
        get __proto__ : function __proto__()
        set __proto__ : function __proto__()

vs

代码语言:javascript
运行
AI代码解释
复制
o = Object.create(Object,{ p : {value: "test"} });
console.log(o.__proto__);

结果是:

代码语言:javascript
运行
AI代码解释
复制
function Object() { [native code] }

和:

代码语言:javascript
运行
AI代码解释
复制
console.log(o)

结果是:

代码语言:javascript
运行
AI代码解释
复制
Function {p: "test"}
    p : "test"
    __proto__ : function Object()
        arguments : null
        assign : function assign()
        caller : null
        create : function create()
        defineProperties : function defineProperties()
        defineProperty : function defineProperty()
        entries : function entries()
        freeze : function freeze()
        getOwnPropertyDescriptor : function getOwnPropertyDescriptor()
        getOwnPropertyDescriptors : function getOwnPropertyDescriptors()
        getOwnPropertyNames : function getOwnPropertyNames()
        getOwnPropertySymbols : function getOwnPropertySymbols()
        getPrototypeOf : function getPrototypeOf()
        is : function is()
        isExtensible : function isExtensible()
        isFrozen : function isFrozen()
        isSealed : function isSealed()
        keys : function keys()
        length : 1
        name : "Object"
        preventExtensions : function preventExtensions()
        prototype : Object
        seal : function seal()
        setPrototypeOf : function setPrototypeOf()
        values : function values()
        __proto__ : function ()
        [[FunctionLocation]] : <unknown>

总的来说,我发现:

代码语言:javascript
运行
AI代码解释
复制
o = {};
// is equivalent to:
o = Object.create(Object.prototype);

好呀

代码语言:javascript
运行
AI代码解释
复制
o = {};
// is equivalent to:
o = Object.create(Object);
EN

回答 2

Stack Overflow用户

发布于 2017-10-21 12:40:05

原因Object是一个用来构建对象的函数:

代码语言:javascript
运行
AI代码解释
复制
Object instanceof Function

所以你也可以这样做:

代码语言:javascript
运行
AI代码解释
复制
const o = new Object();

如果您已经阅读了更多关于javascript中继承的内容,就会知道使用new调用函数实际上构建了一个继承自构造函数.prototype属性的对象,然后使用该对象调用构造函数,因此上面一行等于:

代码语言:javascript
运行
AI代码解释
复制
const o = Object.create( Object.prototype );
Object.call( o );

如果你这样做了

代码语言:javascript
运行
AI代码解释
复制
Object.create( Object )

您将创建一个继承构造函数的对象。我承认,对象实际上是一个函数,它继承了从Object.prototype继承的Function.prototype,这让人非常困惑……

票数 3
EN

Stack Overflow用户

发布于 2018-10-12 01:35:41

使用js-calendar.js中的代码:

代码语言:javascript
运行
AI代码解释
复制
function defineProperties(target, props)
{
  '''
  Object.defineProperty(target, descriptor.key, descriptor);
}
return function(Constructor,protoProps, staticProps)
{
   if (protoProps) defineProperties(Constructor.prototype,protoProps)
   if (staticProps) defineProperties(Constructor,protoProps)
}

如果在第一行中删除了.prototype,则不会创建“object”.structor,因此new不会继承任何内容。在第二行中不需要,因为第一行。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/46863128

复制
相关文章
你的手写 new 实现足够严谨吗?
在开始阅读这篇文章之前,你可以对比下面这两段代码的输出结果是否一致(假设 myNew 是你自己实现的 new 操作):
Chor
2021/06/08
5330
你的手写 new 实现足够严谨吗?
深入理解继承
学习怎样创建对象是理解面向对象编程的第一步,第二步是理解继承。在传统的面向对象编程语言中,类继承其他类的属性。 然而,JS的继承方式与传统的面向对象编程语言不同,继承可以发生对象之间,这种继承的机制是我们已经熟悉的一种机制:原型。
小周sir
2019/09/23
4900
深入理解继承
javascript设计模式五:原型模式
在javascript语言中,原型与原型链是一个非常重要的概念,因为它们是javascript语言得以成立的根本。因为javascript是基于原型的面向对象编程语言,这有别于基于类的java、python等面向对象编程语言。虽然javscript现在也有了class,但它骨子里还是个基于原型的语法糖罢了。所以在使用javascript时,始终要记清基于原型,基于原型,基于原型。
前端_AWhile
2019/08/29
3060
javascript设计模式五:原型模式
JS 原生方法原理探究(三):如何实现 new 操作符?
这是JS 原生方法原理探究系列的第三篇文章。本文会介绍如何模拟实现 new 操作符。关于 new 的具体用法,MDN 已经描述得很清楚了,这里我们只做简单的介绍,具体的重点在于如何模拟实现。
Chor
2021/06/08
1.1K0
JS 原生方法原理探究(三):如何实现 new 操作符?
JavaScript继承与原型链
当谈到继承时,JavaScript 只有一种结构:对象。每个实例对象(object)都有一个私有属性(称之为 __proto__)指向它的构造函数的原型对象(prototype)。该原型对象也有一个自己的原型对象(__proto__),层层向上直到一个对象的原型对象为 null。根据定义,null 没有原型,并作为这个原型链中的最后一个环节。
Andromeda
2023/10/21
1760
JavaScript继承与原型链
再谈构造函数、原型、原型链之间的关系
构造函数、原型、原型链作为ES5的内容,已经是老生常谈的问题了。首先说说为什么要再次拿起这个话题去说呢?这几天有空我会看一些源码,这些源码的底层实现考虑到兼容性还是来源于ES5,很多方法的封装以及实现(不管是按照模块封装还是统一实现)都是面向对象的思想,而且webpack以及rollup打包之后解析出来的代码利用@babel/core和@babel/preset-env转化之后也都是ES5的代码,所以有想再次谈起这个话题,回顾回顾旧知识,温故而知新。
小丑同学
2020/09/21
7120
go: 在proto中使用oneof类型
在proto中,可以使用OneOf类型,使用一个字段存储不同类型的数据。类似go中的interface。
超级大猪
2023/10/19
7170
一篇JavaScript技术栈带你了解继承和原型链
在学习JavaScript中,我们知道它是一种灵活的语言,具有面向对象,函数式风格的编程模式,面向对象具有两点要记住,三大特性,六大原则。
达达前端
2019/11/19
4620
一篇JavaScript技术栈带你了解继承和原型链
在学习JavaScript中,我们知道它是一种灵活的语言,具有面向对象,函数式风格的编程模式,面向对象具有两点要记住,三大特性,六大原则。
Bug开发工程师
2019/11/27
3660
彻底弄懂JS原型与原型链
说到JavaScript的原型和原型链,相关文章已有不少,但是大都晦涩难懂。本文将换一个角度出发,先理解原型和原型链是什么,有什么作用,再去分析那些令人头疼的关系。
hellocoder2029
2022/12/07
1.2K0
彻底搞懂JS原型与原型链
说到JavaScript的原型和原型链,相关文章已有不少,但是大都晦涩难懂。本文将换一个角度出发,先理解原型和原型链是什么,有什么作用,再去分析那些令人头疼的关系。
hellocoder2029
2022/10/17
2.7K1
JavaScript继承和原型链
JS在加载构造函数时,会在内存中生成一个对象,这个对象称为函数的原型对象(prototype)。
前端航航
2022/11/11
4570
Javascript之其实我觉得原型链没有难的那么夸张!
  原型链、闭包、事件循环等,可以说是js中比较复杂的知识了,复杂的不是因为它的概念,而是因为它们本身都涉及到很多的知识体系。所以很难串联起来,有一个完整的思路、脉络。我最近想把js中有意思的知识点都总结整理一下,虽然逃不开一些一模一样的内容,但是自己造一下轮子,按照自己的思路,也别有一番味道。
全栈程序员站长
2022/07/21
6630
Javascript之其实我觉得原型链没有难的那么夸张!
详解JavaScript的继承和原型链(prototype)
JavaScript 的每个实例对象都有一个指向上一层对象的私有属性(称之为 __proto__) ,上一层对象又指向再上一层对象,就这样层层向上直至 __proto__ 属性为 null ,最后这个对象就是 Object 。
Learn-anything.cn
2021/12/22
5470
JS 原生方法原理探究(二):如何实现 Object.create?
这是JS 原生方法原理探究系列的第二篇文章。本文会介绍如何实现 Object.create() 方法。关于这个方法的具体用法,MDN 已经描述得很清楚了,这里我们只做简单的介绍,具体的重点在于如何模拟实现。
Chor
2021/06/08
1.9K0
JS 原生方法原理探究(二):如何实现 Object.create?
JavaScript学习总结(四)——this、原型链、javascript面向对象
根据题目要求,对给定的文章进行摘要总结。
张果
2018/01/04
1.5K0
JavaScript学习总结(四)——this、原型链、javascript面向对象
图解JavaScript对象原型与原型链
原文链接:http://www.shuaihuajun.com/article/javascript-prototype-chain/
陈帅华
2019/07/22
5570
图解JavaScript对象原型与原型链
Javascript之其实我觉得原型链没有难的那么夸张!
  原型链、闭包、事件循环等,可以说是js中比较复杂的知识了,复杂的不是因为它的概念,而是因为它们本身都涉及到很多的知识体系。所以很难串联起来,有一个完整的思路。我最近想把js中有点意思的知识都总结整理一下,虽然逃不开一些一模一样的内容,但是自己造一下轮子,按照自己的思路。也别有一番味道。
zaking
2020/08/19
7540
JavaScript中prototype用法
大部分面向对象的编程语言,都是以类class作为对象的基础语法,js语言不是如此,它的面向对象编程基于‘原型对象’。
全栈程序员站长
2022/09/15
4980
如何创建一个“纯净”的对象
假设 Object 的原型中有一个自定义的 log 属性,我们用字面量语法定义 obj 对象,那么使用 for-in 遍历方法就会遍历到这个 log 对象,为了只遍历其自身的属性,需要增加一层筛选
JS菌
2019/05/06
1.9K0
如何创建一个“纯净”的对象

相似问题

添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档