Javascript 本机对象和宿主对象有什么区别？

What is the difference between native objects and host objects?

提问by ppecher

Does the latter simply refer to nonprimitive function objects that were created by a custom constructor (e.g., var bird1 = new Bird();)?

后者是否只是指由自定义构造函数创建的非原始函数对象（例如，varbird1 = new Bird();）？

回答by ?ime Vidas

Both terms are defined in the ECMAScript specification:

这两个术语都在 ECMAScript 规范中定义：

native object

object in an ECMAScript implementation whose semantics are fully defined by this specification rather than by the host environment.

NOTE Standard native objects are defined in this specification. Some native objects are built-in; others may be constructed during the course of execution of an ECMAScript program.

本机对象

ECMAScript 实现中的对象，其语义完全由本规范而不是宿主环境定义。

注：本规范中定义了标准本机对象。一些本机对象是内置的；其他的可能会在 ECMAScript 程序的执行过程中被构造。

Source: http://es5.github.com/#x4.3.6

来源：http: //es5.github.com/#x4.3.6

host object

object supplied by the host environment to complete the execution environment of ECMAScript.

NOTE Any object that is not native is a host object.

宿主对象

宿主环境提供的对象来完成ECMAScript的执行环境。

注意任何非本机对象都是宿主对象。

Source: http://es5.github.com/#x4.3.8

来源：http: //es5.github.com/#x4.3.8

---

---

A few examples:

几个例子：

Native objects: Object(constructor), Date, Math, parseInt, eval, string methods like indexOfand replace, array methods, ...

本机对象：（Object构造函数）、Date、Math、parseInt、eval、indexOf和等字符串方法replace、 数组方法、 ...

Host objects (assuming browser environment): window, document, location, history, XMLHttpRequest, setTimeout, getElementsByTagName, querySelectorAll, ...

宿主对象（假设浏览器环境）：window, document, location, history, XMLHttpRequest, setTimeout, getElementsByTagName, querySelectorAll, ...

回答by JacquesB

It is more clear if we distinguish between three kinds of objects:

如果我们区分三种对象就更清楚了：

Built-in objects: String, Math, RegExp, Object, Functionetc. - core predefined objects always available in JavaScript. Defined in the ECMAScript spec.

内置对象：String，Math，RegExp，Object，Function等-核心预定义的对象总是可以在JavaScript中。在 ECMAScript 规范中定义。

Host objects: objects like window, XmlHttpRequest, DOM nodes and so on, which is provided by the browser environment. They are distinct from the built-in objects because not all environment will have the same host objects. If JavaScript runs outside of the browser, for example as server side scripting language like in Node.js, different host objects will be available.

宿主对象：window、XmlHttpRequest、 DOM 节点等对象，由浏览器环境提供。它们与内置对象不同，因为并非所有环境都具有相同的宿主对象。如果 JavaScript 在浏览器之外运行，例如作为 Node.js 中的服务器端脚本语言，则不同的主机对象将可用。

User objects: objects defined in JavaScript code. So 'Bird' in your example would be a user object.

用户对象：在 JavaScript 代码中定义的对象。因此，您示例中的“Bird”将是一个用户对象。

The JavaScript spec groups built-in objects and user objects together as native objects. This is an unorthodox use of the term "native", since user objects are obviously implemented in JavaScript while the built-ins is most likely implemented in a different language under the hood, just as the host objects would be. But from the perspective of the JavaScript spec, both builtins and user objects are native to JavaScript because they are defined in the JavaScript spec, while host objects are not.

JavaScript 规范将内置对象和用户对象组合为原生对象。这是术语“原生”的非正统用法，因为用户对象显然是用 JavaScript 实现的，而内置对象很可能是用不同的语言在幕后实现的，就像宿主对象一样。但是从 JavaScript 规范的角度来看，内置对象和用户对象都是 JavaScript 原生的，因为它们是在 JavaScript 规范中定义的，而宿主对象不是。

回答by user113716

Here's my understanding of the spec.

这是我对规范的理解。

This:

这个：

var bird = new Bird();

...results in a native Object that simply happened to be created using the newoperator.

...导致使用new操作符刚好创建的本机对象。

Native objects have an internal [[Class]] property of one of the following:

本机对象具有以下之一的内部 [[Class]] 属性：

"Arguments", "Array", "Boolean", "Date", "Error", "Function", "JSON", "Math", "Number", "Object", "RegExp", and "String".

“参数”、“数组”、“布尔值”、“日期”、“错误”、“函数”、“JSON”、“数学”、“数字”、“对象”、“RegExp”和“字符串”。

For your bird1it will be:

对于您bird1来说，它将是：

"Object"

“目的”

Just like if you create a function:

就像你创建一个函数一样：

function my_func() {
    // ...
}

...my_funcisn't defined in ECMAScript, but it is still a native object with the internal [[Class]]:

...my_func在 ECMAScript 中没有定义，但它仍然是一个具有内部 [[Class]] 的本地对象：

"Function"

“功能”

A host object is an object provided by the environment in order to serve a specific purpose to that environment not defined in by the specification.

宿主对象是环境提供的对象，目的是为规范中未定义的环境提供特定目的。

For example:

例如：

var divs = document.getElementsByTagName('div')

The object referenced by divsis a NodeList, which is integrated into the environment in such a manner that it feels like a regular JavaScript object, yet it isn't defined anywhere by the specification.

引用的对象divs是一个NodeList，它以一种感觉就像一个常规 JavaScript 对象的方式集成到环境中，但它没有被规范定义在任何地方。

Its internal [[Class]] property is:

它的内部 [[Class]] 属性是：

"NodeList"

“节点列表”

This provides implementation designers some flexibility in suiting the implementation to the specific need of the environment.

这为实现设计者在使实现适应环境的特定需要方面提供了一定的灵活性。

There are requirements of host objectsthat are defined throughout the spec.

整个规范中都定义了对宿主对象的要求。

回答by jaaw

Could not see a convincing answer to the question whether var bird1 = new Bird();is a native or host object. Assuming Bird is a user defined function, a native non-built-inobject will be created according to http://es5.github.io/#x13.2by the javascript implementation. In contrast, native built-inobjects will be present since the start of a javascript program (such as Object and many others). A difference between a native object and a host object is that former is created by the javascript implementation and the latter is provided by the host environment. As a result host object internal [[class]] property can be different from those used by built-in objects (i.e. "Arguments", "Array", "Boolean", "Date", "Error", "Function", "JSON", "Math", "Number", "Object", "RegExp", and "String").

对于var bird1 = new Bird();是本机对象还是宿主对象的问题，看不到令人信服的答案。假设Bird是一个用户定义的函数，javascript实现会根据http://es5.github.io/#x13.2创建一个原生的非内置对象。相比之下，原生内置对象将在 javascript 程序（例如 Object 和许多其他程序）启动后出现。本机对象和宿主对象的区别在于，前者由 javascript 实现创建，后者由宿主环境提供。因此，宿主对象内部 [[class]] 属性可能与内置对象使用的属性不同（即“参数”、“数组”、“布尔值”、“日期”、“错误”、“函数”、“ JSON”、“数学”、“数字”、“对象”、“RegExp”和“字符串”）。

Also, worthwhile noting that ECMA6 http://www.ecma-international.org/publications/files/ECMA-ST/Ecma-262.pdfdoes not use the terminology native and host objects any more. Instead, it defines below object types, with more clear explanations of their intended behaviour.

另外，值得注意的是 ECMA6 http://www.ecma-international.org/publications/files/ECMA-ST/Ecma-262.pdf不再使用术语本机和主机对象。相反，它定义了以下对象类型，并对其预期行为进行了更清晰的解释。

4.3.6 ordinary object

object that has the default behaviour for the essential internal methods that must be supported by all objects

4.3.7 exotic object

object that does not have the default behaviour for one or more of the essential internal methods that must be supported by all objects NOTE Any object that is not an ordinary object is an exotic object.

4.3.8 standard object

object whose semantics are defined by this specification

4.3.9 built-in object

object specified and supplied by an ECMAScript implementation

4.3.6 普通对象

具有所有对象必须支持的基本内部方法的默认行为的对象

4.3.7 异物

对于一个或多个必须被所有对象支持的基本内部方法没有默认行为的对象 注意任何不是普通对象的对象都是奇异对象。

4.3.8 标准对象

其语义由本规范定义的对象

4.3.9 内置对象

由 ECMAScript 实现指定和提供的对象

回答by Remi

In addition to the other answers regarding Host Objects.

除了有关主机对象的其他答案。

Host objects are specific to a environment. So next the the browser host objects, there are also specific objects to nodejs.

宿主对象特定于环境。所以接下来是浏览器主机对象，还有 nodejs 的特定对象。

For the sake of the example, first starting with the Standard objects as defined in Javascript. Then the common objects for the Browser/DOM. Node has it's own Objects.

为了示例起见，首先从 Javascript 中定义的标准对象开始。然后是浏览器/DOM 的公共对象。节点有它自己的对象。

1. Standard Javascriptbuilt-in object examples:

   • Object
   • Function
   • Boolean
   • Symbol
   • Number
   • Math
   • ... (See full list on MDN web docs)

2. Host Objects Document Object ModelExamples:

   • Window
   • Document
   • History
   • ... (See full list on DOM objects on MDN web docs)
   • XMLHttpRequest (part of Web API)
   • ... (See full list Web API on MDN web docs)

3. Host Objects in Node.js:

   • http
   • https
   • fs
   • url
   • os
   • ... (See full list on nodejs.org)

1. 标准 Javascript内置对象示例：

   • 目的
   • 功能
   • 布尔值
   • 象征
   • 数字
   • 数学
   • ...（请参阅 MDN 网络文档上的完整列表）

2. 宿主对象文档对象模型示例：

   • 窗户
   • 文档
   • 历史
   • ...（在 MDN 网络文档上查看 DOM 对象的完整列表）
   • XMLHttpRequest（Web API 的一部分）
   • ...（请参阅 MDN 网络文档上的完整列表 Web API）

3. Node.js 中的宿主对象：

   • http
   • https
   • FS
   • 网址
   • 操作系统
   • ...（请参阅 nodejs.org 上的完整列表）

回答by Khamaseen

Considering three objects: Host, Native, Custom.

考虑三个对象：Host、Native、Custom。

Host Objects are created by the environment and are environment specific. Best known environment would be a web-browser but could be another platform. The host objects created in web-browser could be the window object or the document. Typically a browser uses an API to create Host Objects to reflect the Document Object Model into JavaScript. (Webbrowser have different JavaScript Engines that do this) A host object is created automatically the moment the page renders in a browser.

宿主对象由环境创建并且是特定于环境的。最著名的环境是网络浏览器，但也可能是另一个平台。在 web 浏览器中创建的宿主对象可以是窗口对象或文档。通常，浏览器使用 API 来创建宿主对象以将文档对象模型反映到 JavaScript 中。（Webbrowser 有不同的 JavaScript 引擎来执行此操作）当页面在浏览器中呈现时会自动创建一个宿主对象。

A Native Object is created by the developer using predefined classes of JavaScript. Native Objects are in your written script.

本机对象由开发人员使用 JavaScript 的预定义类创建。本机对象在您的书面脚本中。

Than, a Custom Object is made by the developer from a custom (not predefined, or partially predefined) class.

然后，自定义对象是由开发人员从自定义（未预定义或部分预定义）类创建的。

回答by user123444555621

Native objects are objects that adhere to the specs, i.e. "standard objects".

本机对象是符合规范的对象，即“标准对象”。

Host objects are objects that the browser (or other runtime environment like Node) provides.

宿主对象是浏览器（或其他运行时环境，如 Node）提供的对象。

Most host objects are native objects, and whenever you instantiate something using new, you can be 99.99% sure that it is a native object, unless you mess around with weird host objects.

大多数宿主对象都是本机对象，并且每当您使用 实例化某些东西时new，您可以 99.99% 确定它是本机对象，除非您弄乱了奇怪的宿主对象。

This notion has been introduced due to the presence of very bizarre objects in IE_{(and other old browsers?)}. For example:

由于 IE _{（和其他旧浏览器？）中}存在非常奇怪的对象，因此引入了这个概念。例如：

typeof document.all == "undefined"; // true
document.all.myElementId; // object

When seeing this, everyone would agree that document.allis clearly "non-standard", and thus a non-nativehost object.

当看到这个时，每个人都会同意这document.all显然是“非标准的”，因此是一个非本地宿主对象。

So why not call native objects standard objectsin the first place? Simple: after all, the Standard(!) documenttalks about non-native objects too, and calling them non-standardwould lead to a paradox.

那么为什么不首先调用原生对象标准对象呢？很简单：毕竟，Standard(!) 文档也谈到了非本地对象，称它们为非标准会导致悖论。

Again:

再次：

• native == "standard"
• host == provided by the browser or Node or …
• most host objects are native, and all non-host objects are native too

• 本机==“标准”
• 主机 == 由浏览器或 Node 提供或...
• 大多数宿主对象都是原生的，所有非宿主对象也是原生的

回答by Scott Marcus

This may be overkill, but for simplicity a native object is one that exist and is usable in any environment that implements an ECMAScript compliant engine. This is usually (but not always) a browser.

这可能有点矫枉过正，但为了简单起见，本机对象是存在的，并且可以在任何实现 ECMAScript 兼容引擎的环境中使用。这通常（但不总是）是浏览器。

So, your Internet Explorer or your Google Chrome, doesn't make the String object available to you, for example. The reason you can use the String object is because it is "native" (built-in) to the JavaScript language itself.

因此，例如，您的 Internet Explorer 或 Google Chrome 不会使您可以使用 String 对象。您可以使用 String 对象的原因是因为它是 JavaScript 语言本身的“原生”（内置）。

However, if you'd like to create a pop-up window, you'll need to use the window object. The window object is provided by the browser software itself, so it is not native to JavaScript, but it is part of the "Browser Object Model" or the BOM.

但是，如果您想创建一个弹出窗口，则需要使用 window 对象。window 对象由浏览器软件本身提供，因此它不是 JavaScript 原生的，但它是“浏览器对象模型”或 BOM 的一部分。