Shulou(Shulou.com)06/02 Report--

This article mainly explains "is JavaScript object-oriented or object-based". The content of the explanation in this article is simple and clear, and it is easy to learn and understand. Please follow the editor's train of thought to study and learn "JavaScript is object-oriented or object-based".

What is the object?

First of all, let's talk about what the object is. Because of translation, it is difficult for us to understand the real meaning of "object" in the Chinese context. In fact, Object is the general name of everything in English, which has something in common with the abstract thinking of object-oriented programming. The Chinese word for "object" does not have such universality, and we understand it more as a professional term in the process of learning programming.

But in any case, we should realize that objects are not a concept created out of thin air in the computer field. It is an abstraction that follows the human mode of thinking (so object-oriented programming is also considered to be a programming paradigm closer to the human mode of thinking).

So, let's first look at what the object is in the human mode of thinking.

The concept of object is formed in the early childhood of human beings, which is far earlier than the concepts of value, process and so on commonly used in our programming logic. In childhood, we always realize that a certain apple can be eaten (one apple here is an object), and then realize that all apples can be eaten (all apples here are one class). It was not until later that we realized the connection between three apples and three pears, thus giving rise to the concept of the number "3" (value).

Grady Booch sums it up for us in the book object-oriented Analysis and Design. He believes that from a human cognitive point of view, an object should be one of the following:

Something that can be touched or seen.

Something that can be understood by human intelligence

Something that guides thinking or action (imagining or exerting actions).

With the natural definition of objects, we can describe objects in programming languages. In different programming languages, designers also use a variety of different language features to describe objects abstractly, the most successful school is to use "class" to describe objects, which gave birth to popular programming languages such as C++, Java and so on. In the early years, JavaScript chose a more unpopular approach: prototypes. This is one of the reasons why I said earlier that it was unsociable.

Unfortunately, however, for some corporate political reasons, JavaScript was ordered by management to imitate Java when it was launched, so JavaScript founder Brendan Eich introduced language features such as new and this on the basis of the "prototype runtime" to make it "look more like Java".

Before the advent of ES6, a large number of JavaScript programmers tried to make JavaScript more like class-based programming based on the prototype system, resulting in many so-called "frameworks", such as PrototypeJS and Dojo. In fact, they have become some kind of eccentric dialect of JavaScript, even creating a series of incompatible communities, and it is clear that the gains far outweigh the losses.

If we talk about objects from a run-time perspective, we are talking about the actual run-time model of JavaScript, because no code execution can bypass the run-time object model, but fortunately, from a run-time point of view, you don't have to be bothered by these "class-based facilities" because the concept of runtime classes in any language is weakened.

First, let's take a look at how JavaScript designs the object model.

Characteristics of JavaScript object

In my opinion, no matter what programming language we use, we should first understand the essential characteristics of objects (see Grandy Booch "object-oriented Analysis and Design"). To sum up, the object has the following characteristics.

Objects are uniquely identifiable: even two objects that are exactly the same are not the same object.

Objects have states: objects have states, and the same object may be in different states.

An object has behavior: that is, the state of an object may change because of its behavior.

Let's first look at the first feature, the object has a unique identity. Generally speaking, the unique identification of objects in various languages is reflected by memory addresses, so JavaScript programmers all know that any different JavaScript objects are actually not equal to each other. We can look at the following code, o1 and O2 are two identical objects at first glance, but the printed result is false.



Var o1 = {a: 1}; var o2 = {a: 1}; console.log (o1 = = O2); / / false

With regard to the second and third characteristics of objects, "state and behavior", different languages use different terms to describe them abstractly, such as "member variables" and "member functions" in C++ and "properties" and "methods" in Java.

In JavaScript, the state and behavior are abstracted as "attributes". Considering that the function is designed as a special object in JavaScript (I will explain this in detail later, there is no need to delve into it here), so the behavior and state in JavaScript can be abstracted with attributes.

The following code actually shows an example of a common property and a function as an attribute, where o is an object, d is an attribute, and function f is also an attribute. Although it is written differently, d and f are two common attributes for JavaScript.

Var o = {d: 1, f () {console.log (this.d);}}

So, to sum up, in JavaScript, the state and behavior of objects are actually abstracted into attributes. If you've ever used Java, don't be surprised. Although there are some differences in design ideas, both of them represent the basic characteristics of objects: identification, state, and behavior.

On the basis of realizing the basic characteristics of the object, I think the unique feature of the object in JavaScript is that the object is highly dynamic, because JavaScript gives users the ability to change the state and behavior of the object at run time.

Let me give you an example. For example, JavaScript allows the runtime to add properties to objects, which is completely different from most class-based, static object designs. If you have used Java or any other language, you will definitely feel the same way as I do.

The following code shows how the runtime adds properties to an object. At first, I define an object o, and then add its property b after the definition is complete. You have to understand that.

Var o = {a: 1}; o.b = 2placeconsole.log (o.a, o.b); / / 12

To improve abstraction, JavaScript properties are designed to be more complex than other languages, providing data properties and accessor properties (getter/setter).

Two types of properties of JavaScript object

For JavaScript, attributes are not just simple names and values. JavaScript uses a set of attribute to describe attributes (property).

Let's start with the first category of attributes, data attributes. It is close to the concept of attributes in other languages. Data attributes have four characteristics.

Value: is the value of the attribute.

Writable: determines whether an attribute can be assigned.

Enumerable: determines whether for in can enumerate this property.

Configurable: determines whether the attribute can be deleted or changed.

In most cases, we only care about the value of the data attribute.

The second type of property is the getter/setter property, which also has four characteristics.

Getter: a function or undefined that is called when a property value is fetched.

Setter: function or undefined, called when setting the value of the property.

Enumerable: determines whether for in can enumerate this property.

Configurable: determines whether the attribute can be deleted or changed.

The accessor property causes the property to execute code when reading and writing, which allows the user to get completely different values when writing and reading the property, which can be regarded as a syntax sugar of a function.

The code we usually use to define attributes produces data attributes, where writable, enumerable, and configurable all default to true. We can use the built-in function Object.getOwnPropertyDescripter to view it, as shown in the following code:

Var o = {a: 1}; o.b = 2There are data attributes Object.getOwnPropertyDescriptor (o, "a") / / {value: 1, writable: true, enumerable: true, configurable: true} Object.getOwnPropertyDescriptor (o, "b") / / {value: 2, writable: true, enumerable: true, configurable: true}

We use two kinds of syntax to define the attribute here. After defining the attribute, we use the API of JavaScript to view the attribute. We can find that the properties defined in this way are all data properties, and the default values of writeable, enumerable, and configurable are true.

If we want to change the characteristics of a property, or define an accessor property, we can use Object.defineProperty, as shown in the following example:

Var o = {a: 1}; Object.defineProperty (o, "b", {value: 2, writable: false, enumerable: false, configurable: true}); / / an and b are data attributes, but the eigenvalues change Object.getOwnPropertyDescriptor (o, "a"); / / {value: 1, writable: true, enumerable: true, configurable: true} Object.getOwnPropertyDescriptor (o, "b"); / / {value: 2, writable: false, enumerable: false, configurable: true} o.b = 3 Console.log (o.b); / / 2

Here we use Object.defineProperty to define attributes, so that defining attributes can change the writable and enumerable of attributes. We also use Object.getOwnPropertyDescriptor to look at it and find that it does change the writable and enumerable characteristics. Because the writable characteristic is false, we re-assign to b, and the value of b does not change.

When you create an object, you can also use the get and set keywords to create accessor properties, as follows:



Var o = {get a () {return 1}}; console.log (o.a); / / 1

Accessor properties are different from data properties in that getter or setter functions are executed each time the property is accessed. Here our getter function returns 1, so O.A gets 1 every time.

In this way, we understand that the runtime of a JavaScript object is actually a "collection of attributes" with a string or Symbol as key and a data property eigenvalue or accessor attribute as value. An object is an index structure of an attribute (an index structure is a common data structure, which we can think of as a dictionary that can look up value with key at a relatively fast speed). Let's take the object o above as an example, you can imagine that "a" is key.

Here {writable:true,value:1,configurable:true,enumerable:true} is value. In the previous types course, we introduced the Symbol type, which can have the attribute name Symbol, which is a feature of the JavaScript object.

At this point, if you understand the characteristics of the object, it is not difficult to understand the questions I raised at the beginning.

You can even understand why there is a saying that "JavaScript is not object-oriented": the object design of JavaScript is very different from the current mainstream class-based object-oriented. In fact, such an object system design is special, but JavaScript provides a full runtime object system, which allows it to imitate most object-oriented programming paradigms, so it is also an orthodox object-oriented language.

The JavaScript language standard has also made it clear that JavaScript is an object-oriented language, which I think can be said because of the highly dynamic object system of JavaScript.

Therefore, we should fully tap its ability on the basis of understanding its design ideas, rather than mechanically imitating other languages.

Knot

In order to understand JavaScript objects, we must clear out the relevant knowledge of "class-based object-oriented" in our mind, and return to the basic theory that human's simple cognition of objects has nothing to do with object-oriented language, so that we can understand the idea of JavaScript object-oriented design.

When many people think about JavaScript objects, they will look at the problem with the existing "object" view, and the end result is, of course, "disorderly".

Thank you for your reading, the above is the content of "JavaScript is object-oriented or object-based". After the study of this article, I believe you have a deeper understanding of whether JavaScript is object-oriented or object-based, and the specific use needs to be verified in practice. Here is, the editor will push for you more related knowledge points of the article, welcome to follow!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.