JavaScriptはオブジェクトベースですか?-フロントエンドQ&A-php.cn

Javascript はオブジェクトベースであり、オブジェクトを作成するだけでなく、既存のオブジェクトを使用することもできるオブジェクトベースのスクリプト言語です。 JavaScript 標準のオブジェクトベースの定義: 言語とホストのインフラストラクチャはオブジェクトによって提供され、JavaScript プログラムは相互に通信するオブジェクトのコレクションです。

JavaScriptはオブジェクトベースですか?

このチュートリアルの動作環境: Windows 7 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。

こんにちは、アリババモバイルタオバオフロントエンドの元責任者のウィンターです。この記事は、Geek Time のコラム「フロントエンドの学び直し」で JavaScript について説明した部分から抜粋したものです。

他の言語と比較すると、JavaScript の「オブジェクト」はいつもそれほど集合的ではないように見えます。初心者が JavaScript オブジェクト指向を学ぶとき、よく疑問に思うことがあります。JavaScript (ES6 まで) にはオブジェクトの概念があるのに、他の言語のようなクラスの概念がないのはなぜですか? JavaScript オブジェクトにはプロパティを自由に追加できるのに、他の言語には追加できないのはなぜですか?

一部の議論でも、JavaScript は「オブジェクト指向言語」ではなく、「オブジェクトベース言語」であると強調する人もいて、この主張はかつて広く流布しましたが、実際、私が持っている保持者は、これまでに遭遇したこの発言をする人は、「オブジェクト指向とオブジェクトベースをどのように定義するか」という質問に答えることができません。

実際、オブジェクトベースとオブジェクト指向という 2 つの形容詞は、JavaScript 標準のさまざまなバージョンに登場しています。まず、JavaScript 標準のオブジェクトベースの定義を見てみましょう。この定義の具体的な内容は次のとおりです: 「言語とホストのインフラストラクチャはオブジェクトによって提供され、ECMAScript プログラムは相互に通信するオブジェクトのコレクションです」。」ここでの意味は、オブジェクト指向の意味が弱まったことを表現することではなく、言語にとってのオブジェクトの重要性を表現することです。

そこで、この記事では、JavaScript におけるオブジェクト指向とオブジェクト指向が何であるかを理解できるようにしていきます。

オブジェクトとは何ですか?

まず、オブジェクトとは何かについて話しましょう。翻訳の都合上、中国語の文脈で「オブジェクト」の本当の意味を理解することは困難です。実は、Object（オブジェクト）とは英語であらゆるものの総称であり、オブジェクト指向プログラミングの抽象的な考え方と共通点があります。中国語の「物」にはそれほど普遍性はなく、プログラミングを学ぶ過程で専門用語として理解するようになります。

しかし、何はともあれ、オブジェクトはコンピューター分野で何もないところから作成された概念ではなく、人間の思考パターンに従う抽象化であることを認識する必要があります (したがって、オブジェクト指向プログラミングも考慮されます: 詳細人間の心のプログラミングパラダイム)。

それでは、まず人間の思考モデルにおけるオブジェクトとは正確には何なのかを見てみましょう。

オブジェクトの概念は人間の幼少期に形成され、プログラミングロジックで一般的に使用される値や手順などの概念よりもはるかに古いものです。子供の頃、私たちはいつも、最初に特定のリンゴが食べられることに気づき（ここでの特定のリンゴはオブジェクトです）、次にすべてのリンゴが食べられることに気づきます（ここにあるすべてのリンゴはクラスです）。私たちは 3 つのリンゴと 3 つの梨の関係に気づき、数字「3」（価値）の概念につながります。

著書「オブジェクト指向の分析と設計」の中で、Grady Booch がそれをまとめてくれました。彼は、人間の認知の観点から、オブジェクトは次のいずれかであるべきだと考えています:

人間の知性によって理解できるもの;
思考や行動 (想像したり、行動を実行したり) を導くことができるもの。

オブジェクトの自然な定義を使用して、プログラミング言語でオブジェクトを記述することができます。さまざまなプログラミング言語でも、デザイナーはオブジェクトを抽象的に記述するためにさまざまな言語機能を使用しますが、最も成功した流派は、「クラス」を使用してオブジェクトを記述することであり、C や Java などの人気のあるプログラミング言語が誕生しました。初期の JavaScript は、より評判の悪いプロトタイプという手法を選択しました (次の記事ではプロトタイプに焦点を当てますが、ここでは印象に残るだけで構いません)。先ほど「社交的ではない」と述べた理由の一つがこれです。

残念ながら、会社の政治的理由により、JavaScript は発売時に Java を模倣するよう経営陣から命令されました。そのため、JavaScript の創設者であるブレンダン・アイヒ氏は、JavaScript を「より Java に近づける」ための新しい言語機能を導入しました。。

ES6 が登場する前は、多くの JavaScript プログラマーが、JavaScript をプロトタイプシステムに基づいたクラスベースプログラミングに近づけようと試み、その結果、PrototypeJS や Dojo などのいわゆる「フレームワーク」が多数誕生しました。。実際、それらは JavaScript の一種の奇妙な方言となり、相互に互換性のない一連のコミュニティさえも生み出しました。

ランタイムの観点からオブジェクトについて話す場合、JavaScript の実際の実行モデルについて話していることになります。これは、コードの実行ではランタイムオブジェクトモデルを回避する必要があるためです。ただし、幸いなことに、ランタイムの観点から見ると、そのようなことはありません。どの言語ランタイムでもクラスの概念は弱められているため、これらの「クラスベースの機能」に悩まされる必要はありません。

まず、JavaScript がオブジェクトモデルをどのように設計するかを見てみましょう。

JavaScript オブジェクトの特性

私の意見では、どのようなプログラミング言語を使用するとしても、まずオブジェクトの本質的な特性を理解する必要があります (Grandy Booch の「オブジェクト指向の分析と設計」を参照) 》）。要約すると、このオブジェクトには次のような特徴があります。

オブジェクトは一意に識別可能です。まったく同じ 2 つのオブジェクトであっても、同じオブジェクトではありません。
オブジェクトはステートフルです: オブジェクトには状態があり、同じオブジェクトが異なる状態になる可能性があります。
オブジェクトには動作があります。つまり、オブジェクトの状態はその動作によって変化する可能性があります。

まず最初の特徴を見てみましょう。オブジェクトは一意に識別可能です。一般的に言えば、さまざまな言語におけるオブジェクトの一意の識別はメモリアドレスに反映されます。したがって、JavaScript プログラマは、異なる JavaScript オブジェクトが実際には互いに等しくないことを知っています。次のコードを見ることができます。o1 と o2一見すると、これらは 2 つの同一のオブジェクトですが、出力される結果は false です。

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

ログイン後にコピー

オブジェクトの 2 番目と 3 番目の特性「状態と動作」については、言語によって抽象的に表現する用語が異なります。たとえば、C では「メンバー変数」と「メンバー関数」と呼びます。 ", Java では、これらを「プロパティ」と「メソッド」と呼びます。

JavaScript では、状態と動作は「プロパティ」に統合され、抽象化されます。 JavaScript では関数が特別なオブジェクトとして設計されていると考えると (これについては後で詳しく説明します)、特に必要はありません。詳細はここで説明します)。そのため、JavaScript の動作と状態は属性を使用して抽象化できます。

実際に以下のコードは、oがオブジェクト、dが属性、関数fも属性として、通常の属性と属性として関数を記述した例であり、書き方は同じではありませんが、 JavaScript に適しています。たとえば、d と f は 2 つの一般的な属性です。

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

ログイン後にコピー

つまり、JavaScript では、オブジェクトの状態と動作は実際には属性に抽象化されます。 Java を使用したことがある場合は、驚かないでください。設計上の考え方には一定の違いがありますが、どちらもオブジェクトの基本的な特性 (アイデンティティ、ステータス、動作) をよく表現しています。

オブジェクトの基本的な特性を理解したことに基づいて、JavaScript におけるオブジェクトの固有の特性は次のとおりであると考えています: オブジェクトは非常に動的です。これは、JavaScript によってユーザーが実行時にアクションを実行できるためです。状態と動作を追加するオブジェクトの機能。

例を挙げてみましょう。たとえば、JavaScript では実行時にオブジェクトにプロパティを追加できますが、これはほとんどのクラスベースの静的オブジェクト設計とはまったく異なります。 Java やその他の言語を使用したことがある方なら、きっと私と同じ気持ちになるはずです。

次のコードは、実行時にオブジェクトに属性を追加する方法を示しています。最初に、オブジェクト o を定義しました。定義が完了したら、その属性 b を追加しました。この操作はまったく問題ありません。これを理解する必要があります。

var o = { a: 1 };o.b = 2;console.log(o.a, o.b); //1 2

ログイン後にコピー

JavaScript のプロパティは、抽象化機能を向上させるために、他の言語よりも複雑になるように設計されており、2 種類のデータプロパティとアクセサープロパティ (ゲッター/セッター) が提供されています。

JavaScript オブジェクトの 2 種類の属性

JavaScript の場合、属性は単なる名前と値ではなく、一連の特性を使用してプロパティを記述します。

最初のタイプの属性であるデータ属性について話しましょう。他の言語の属性概念に近いです。データ属性には 4 つの特性があります。

value: 属性の値です。
writable: 属性に値を割り当てることができるかどうかを決定します。
enumerable: for in がプロパティを列挙できるかどうかを決定します。
configurable: 属性を削除できるか、特性値を変更できるかを決定します。

ほとんどの場合、データ属性の値のみを考慮します。

2 番目のタイプの属性はアクセサー (ゲッター/セッター) 属性 で、これにも 4 つの特性があります。

getter: プロパティ値を取得するときに呼び出される関数または未定義。
setter: プロパティ値を設定するときに呼び出される関数または未定義。
enumerable: for in がプロパティを列挙できるかどうかを決定します。
configurable: 属性を削除できるか、特性値を変更できるかを決定します。

アクセサ属性を使用すると、プロパティの読み取り時と書き込み時にコードを実行できます。これにより、ユーザーはプロパティの書き込み時と読み取り時に完全に異なる値を取得できます。これは、プロパティの糖衣構文とみなすことができます。関数。

通常、コードを使用して属性を定義し、データ属性を生成します。書き込み可能、列挙可能、構成可能はすべてデフォルトで true になります。次のコードに示すように、組み込み関数 Object.getOwnPropertyDescripter を使用して表示できます。

var o = { a: 1 };o.b = 2;//a和b皆为数据属性
Object.getOwnPropertyDescriptor(o,\u0026quot;a\u0026quot;) // {value: 1, writable: true, enumerable: true, configurable: true}
Object.getOwnPropertyDescriptor(o,\u0026quot;b\u0026quot;) // {value: 2, writable: true, enumerable: true, configurable: true}

ログイン後にコピー

我们在这里使用了两种语法来定义属性，定义完属性后，我们用JavaScript的API来查看这个属性，我们可以发现，这样定义出来的属性都是数据属性，writeable、enumerable、configurable都是默认值为true。

如果我们要想改变属性的特征，或者定义访问器属性，可以使用 Object.defineProperty，示例如下：

var o = { a: 1 };
Object.defineProperty(o, \u0026quot;b\u0026quot;, {value: 2, writable: false, enumerable: false, configurable: true});//a和b都是数据属性，但特征值变化了
Object.getOwnPropertyDescriptor(o,\u0026quot;a\u0026quot;); // {value: 1, writable: true, enumerable: true, configurable: true}
Object.getOwnPropertyDescriptor(o,\u0026quot;b\u0026quot;); // {value: 2, writable: false, enumerable: false, configurable: true}
o.b = 3;console.log(o.b); // 2

ログイン後にコピー

这里我们使用了Object.defineProperty来定义属性，这样定义属性可以改变属性的writable和enumerable，我们同样用Object.getOwnPropertyDescriptor来查看，发现确实改变了writable和enumerable特征。因为writable特征为false，所以我们重新对b赋值，b的值不会发生变化。

在创建对象时，也可以使用 get 和 set 关键字来创建访问器属性，代码如下所示：

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

ログイン後にコピー

访问器属性跟数据属性不同，每次访问属性都会执行getter或者setter函数。这里我们的getter函数返回了1，所以o.a每次都得到1。

这样，我们就理解了，实际上JavaScript 对象的运行时是一个“属性的集合”，属性以字符串或者Symbol为key，以数据属性特征值或者访问器属性特征值为value。对象是一个属性的索引结构（索引结构是一类常见的数据结构，我们可以把它理解为一个能够以比较快的速度用key来查找value的字典）。我们以上面的对象o为例，你可以想象一下“a”是key。

这里{writable:true,value:1,configurable:true,enumerable:true}是value。我们在前面的类型课程中，已经介绍了Symbol类型，能够以Symbol为属性名，这是JavaScript对象的一个特色。

讲到了这里，如果你理解了对象的特征，也就不难理解我开篇提出来的问题。

你甚至可以理解为什么会有“JavaScript不是面向对象”这样的说法：JavaScript的对象设计跟目前主流基于类的面向对象差异非常大。而事实上，这样的对象系统设计虽然特别，但是JavaScript提供了完全运行时的对象系统，这使得它可以模仿多数面向对象编程范式（下一节课我们会给你介绍JavaScript中两种面向对象编程的范式：基于类和基于原型），所以它也是正统的面向对象语言。

JavaScript语言标准也已经明确说明，JavaScript是一门面向对象的语言，我想标准中能这样说正因为JavaScript的高度动态性的对象系统。

所以，我们应该在理解其设计思想的基础上充分挖掘它的能力，而不是机械地模仿其它语言。

结语

要想理解JavaScript对象，必须清空我们脑子里“基于类的面向对象”相关的知识，回到人类对对象的朴素认知和面向对象的语言无关基础理论，我们就能够理解JavaScript面向对象设计的思路。

在这篇文章中，我从对象的基本理论出发，和你理清了关于对象的一些基本概念，分析了JavaScript对象的设计思路。接下来又从运行时的角度，介绍了JavaScript对象的具体设计：具有高度动态性的属性集合。

很多人在思考JavaScript对象时，会带着已有的“对象”观来看问题，最后的结果当然就是“剪不断理还乱”了。

【相关推荐：javascript学习教程】
以上がJavaScriptはオブジェクトベースですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。