Javascript はオブジェクト指向です。js の各組み込みオブジェクトは object から派生しているため、js がプロトタイプに基づいている場合でも、継承、ポリモーフィズム、再構築という 3 つのオブジェクト指向機能があります。 , しかし、一般的な考え方はオブジェクト指向言語です。
このチュートリアルの動作環境: Windows7 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。
他の言語と比較すると、JavaScript の「オブジェクト」はいつもそれほど集合的ではないように見えます。初心者が JavaScript オブジェクト指向を学ぶとき、よく疑問に思うことがあります。JavaScript (ES6 まで) にはオブジェクトの概念があるのに、他の言語のようなクラスの概念がないのはなぜですか? JavaScript オブジェクトにはプロパティを自由に追加できるのに、他の言語には追加できないのはなぜですか?
一部の議論でも、JavaScript は「オブジェクト指向言語」ではなく、「オブジェクトベース言語」であると強調する人もいて、この主張はかつて広く流布しましたが、実際、私が持っている保持者は、これまでに遭遇したこの発言をする人は、「オブジェクト指向とオブジェクトベースをどのように定義するか」という質問に答えることができません。
実際、オブジェクトベースとオブジェクト指向という 2 つの形容詞は、JavaScript 標準のさまざまなバージョンに登場しています。まず、JavaScript 標準のオブジェクトベースの定義を見てみましょう。この定義の具体的な内容は次のとおりです: 「言語とホストのインフラストラクチャはオブジェクトによって提供され、ECMAScript プログラムは相互に通信するオブジェクトのコレクションです」 。」ここでの意味は、オブジェクト指向の意味が弱まったことを表現することではなく、言語にとってのオブジェクトの重要性を表現することです。
そこで、この記事では、JavaScript におけるオブジェクト指向とオブジェクト指向が何であるかを理解できるようにしていきます。
まず、オブジェクトとは何かについて話しましょう。翻訳の都合上、中国語の文脈で「オブジェクト」の本当の意味を理解することは困難です。実際、オブジェクトは英語であらゆるものの総称であり、オブジェクト指向プログラミングの抽象的な考え方と共通点があります。中国語の「物」にはそれほど普遍性はなく、プログラミングを学ぶ過程で専門用語として理解するようになります。
しかし、何はともあれ、オブジェクトはコンピューター分野で何もないところから作成された概念ではなく、人間の思考パターンに従う抽象化であることを認識する必要があります (したがって、オブジェクト指向プログラミングも考慮されます: 詳細人間の心のプログラミングパラダイム)。
それでは、まず人間の思考モデルにおけるオブジェクトとは正確には何なのかを見てみましょう。
オブジェクトの概念は人間の幼少期に形成され、プログラミング ロジックで一般的に使用される値や手順などの概念よりもはるかに古いものです。子供の頃、私たちは常に、最初に特定のリンゴが食べられることに気づき（ここでの特定のリンゴはオブジェクトです）、次にすべてのリンゴが食べられることに気づき（ここにあるすべてのリンゴはクラスです）、その後で、そのときのみ食べられることに気づきます。私たちは、リンゴ 3 個と梨 3 個の関係に気づき、「3」という数字（価値）の概念を生成します。
「オブジェクト指向の分析と設計」という本で、Grady Booch がそれをまとめてくれました。彼は、人間の認知の観点から、オブジェクトは次のいずれかであるべきだと考えています:
触れたり見たりできるもの;
人間の知性によって理解できるもの;
思考や行動（行動を想像したり実行したり）を導きます。
オブジェクトの自然な定義を使用して、プログラミング言語でオブジェクトを記述することができます。さまざまなプログラミング言語でも、デザイナーはオブジェクトを抽象的に記述するためにさまざまな言語機能を使用しますが、最も成功した流派は、「クラス」を使用してオブジェクトを記述することであり、C や Java などの人気のあるプログラミング言語が誕生しました。初期の JavaScript は、より評判の悪いプロトタイプという手法を選択しました (次の記事ではプロトタイプに焦点を当てますが、ここでは印象に残るだけで構いません)。先ほど「社交的ではない」と述べた理由の一つがこれです。
残念ながら、会社の政治的理由により、JavaScript は発売時に Java を模倣するよう経営陣から命令されました。そのため、JavaScript の創設者であるブレンダン・アイヒ氏は、JavaScript を「より Java に近づける」ための新しい言語機能を導入しました。 。
ES6 が登場する前は、多くの JavaScript プログラマーが、JavaScript をプロトタイプ システムに基づいたクラスベース プログラミングに近づけようと試み、その結果、PrototypeJS や Dojo などのいわゆる「フレームワーク」が多数誕生しました。 。実際、それらは 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 2JavaScript のプロパティは、抽象化機能を向上させるために、他の言語よりも複雑になるように設計されており、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}ここでは 2 つの構文を使用してプロパティを定義します。プロパティを定義した後、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 サイトの他の関連記事を参照してください。
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
