Deep understanding of JavaScript - everything is an object

Let's start with a controversial statement - "In JavaScript, everything is an object. If you understand objects, you can understand JavaScript"

Do you think this sentence is right or wrong, why? In fact, someone asked a question on Zhihu- how to understand that everything in javascript is an object?

We might as well put it for a while. At the end of the article, the author will give his own answer. If you want to see the answer, you can directly scroll to the end of the article.

In the previous article, what is the composition of JavaScript , the author once brought it:

The reference type is object (a collection of properties)

And what does this object include, and what are the functions such as Function and Array that appeared in the previous case?

Here are quotes from two books and MDN, and combined to give it the next qualitative:

According to "JavaScript Advanced Programming Fourth Edition" (hereafter abbreviated as Elevation 4):

Reference types include: Object, Array, typed array, Date, RegExp, Function, basic packaging types (String, Number, Boolean), single built-in objects (Global, Math), ES6 new reference types (Map, WeakMap, Set, WeakSet)

In "JavaScript Revelation", 9 native (or built-in) object constructors are given, String, Number, Boolean, Object, Array, Function, Date, RegExp, Error

MDN is more comprehensive, not only has value attributes (NaN, undefined), function attributes (eval, isNaN, parseFloat, encodeURI), basic objects (Object, Function, Boolean, Symbol), error objects (Error, TypeError, ReferenceError), numbers and date objects (Number, BigInt, Math, Date), strings (String, RegExp), indexable collection objects (Array), combined objects using keys (Map, Set, WeakMap, WeakSet), structured data (ArrayBuffer) , JSON), Control Abstract Objects (Promise, Generator), Reflection (Reflect, Proxy), Internationalization (Int1), WebAssembly, arguments, etc.

Personally think that the content on MDN can be viewed as a dictionary, and the external (interview) can be explained with the standard of elevation four

Etc., etc

Doesn't it mean that the reference type refers to the object (object), why are these things included, are they not built-in objects?

object~~

Built-in objects~~

Does it mean that objects include built-in objects?

That's why MDN says: An object is an area in memory that can be referenced by an identifier

Elevation Si Cai said: ECMA-262 defines an object as an unnecessary combination of a set of attributes. Think of an ECMAScript object as a hash table, where the memory is a set of name/value pairs, and the values can be data or functions

So objects in JavaScript contain built-in objects (or objects consist of built-in objects and custom objects)

Due to the lower-level design of "prototype" and "inheritance", the object is the "ancestral giant". Based on it, String, Number, Boolean, Array, Function, Date, RegExp, Error, etc. form a constructor with their own characteristics. Of course, I don't know them, and there are many other built-in objects.

Later, I saw this explanation while looking at The Definitive Guide to JavaScript (6th Edition):

The following terms distinguish three types of JavaScript objects and two types of properties

• A native object is an object or class defined by the ECMAScript specification. For example, arrays, functions, dates, and regular expressions are all built-in objects
• A host object is defined by the hosting environment (such as a web browser) in which the JavaScript interpreter is embedded
• A user-defined object is an object created by running JavaScript code
• Own properties are properties defined directly in the object
• Inherited properties are properties defined in the object's prototype object

So the "object" in JavaScript is very powerful, and most elements are built on the basis of "object". Among them, Object, Function, and Array are more important, which will be introduced later. Single built-in objects, other built-in functions, and ES6's new Map, Set, WeakMap, and WeakSet will not be introduced for the time being. Here we will talk about the basic packaging types first.

Basic packaging type

Basic packaging types include: String, Number, Boolean, what is the difference between it and string, number, and boolean in basic types

Take a look at the following code first:

 var string1 = 'foo';
var string2 = String('foo');
var number1 = 10;
var number2 = Number('10');
var boolean1 = true;
var boolean2 = Boolean('true');

console.log(typeof string1, typeof string2); // 输出 'string, string'
console.log(typeof number1, typeof number2); // 输出 'number, number'
console.log(typeof boolean1, typeof boolean2); // 输出 'boolean, boolean'

// 如果使用创建对象的构造函数和new关键字
var myString = new String('male');
var myNumber = new Number(23);
var myBoolean = new Boolean(false);
console.log(typeof myString, typeof myNumber, typeof myBoolean);
// object, object, object

We see that if the value is created using the literal syntax, the output of the data type is the primitive type

If you use the new keyword to create String(), Number(), Boolean() values, the created object is actually an object (reference type)

This shows that the new keyword has done some tricks, and specific follow-up articles will introduce it

Also see that whether the value is created literally or the base wrapper type is called without new, they are converted to their corresponding types

Look at this example again

 let str = "Hello";

console.log(str.toUpperCase()); // HELLO

Why does a basic type have the method toUpperCase? Since it is a basic type, it is a string. Why does it have a method? Where does the method come from?

The interpretation of elevation four is:

Anytime a string value is accessed in read mode, the following 3 steps are performed in the background:

1. Create an instance of type String;
2. call a specific method on an instance
3. destroy instance

Think of these 3 steps as executing the following 3 lines of ECMAScript code:

 let s1 = new String("some text")
let s2 = s1.substring(2)
s1 = null

The answer given by JavaScript Info is:

Here is the paradox faced by JavaScript creators:

• One might want to do a lot with primitive types like strings or numbers. It's best to use methods to access them.
• Primitive types must be as simple and lightweight as possible.

And the solution looks somewhat awkward, as follows:

1. Primitive types are still primitives. As expected, providing a single value
2. JavaScript allows access to methods and properties of strings, numbers, booleans and symbols.
3. To make them work, special "object wrappers" are created that provide extra functionality and are destroyed after use.

“对象包装器”对于每种原始类型都是不同的，它们被称为String 、 Number 、 Boolean 、 Symbol and BigInt . Therefore, they offer different methods.

Both give an answer:

When calling basic types such as strings and numbers, the ECMAScript engine will use the basic wrapper type as a constructor to create an instance based on it.

So it also explains that although they are primitive types, they can call various prototype methods

It also reflects the special scenarios that individual types need as well as need (not only lightweight and small memory, but also convenient methods), and all of this is to improve performance

Everything in JavaScript is an object?

Back to the beginning: how to understand that everything in JavaScript is an object?

The author's answer is:

Can't say everything, but basically not bad

JavaScript is divided into primitive types and reference types by data type. Primitive types are called primitive values, which include string, number, boolean, null, undefined, symbol, and bigint; while reference types are objects, which are divided into built-in objects, host objects, and custom objects. There are Object, Array, typed array (typed array), Date, RegExp, Function, basic packaging types (String, Number, Boolean), single built-in objects (Global, Math), ES6 new reference types (Map, WeakMap, Set, WeakSet), etc., you can check MDN for more details

The code you write is all objects except for the basic types, and the string, number, boolean, symbol, bigInt in the basic types have the relationship with the basic wrapper type to delete the instance after calling the prototype method. In short, they enjoy the light weight and small memory footprint of basic types, and get various prototype methods for calling built-in constructors

Among the basic types, except for null and undefined, the rest are related to objects, and reference types refer to objects, so it is generally correct to say that everything in JavaScript is an object

In the next section, let's take a look at the built-in constructors in objects - Object

References

• JavaScript Advanced Programming 4th Edition
• The Definitive Guide to JavaScript
• JavaScript Apocalypse
• MDN
• Modern JavaScript Tutorial

series of articles

• Deep understanding of JavaScript - the beginning
• Deep understanding of JavaScript - what is JavaScript
• Deep understanding of JavaScript - what JavaScript consists of