JavaScriptの対象

5635 ワード

ES 6が現れる前に、JavaScriptは本当にオブジェクト指向プログラミング言語と呼ばれることができませんでした.classは単にキーワードではなく、その保留ワードとしてのみ使用されています.ES 6の後にclassを導入して、プログラマがより身近な方法でオブジェクトを作成することができます.
ES 6とES 5にはどのような違いがありますか?上記のようにプログラマがよりさわやかにcodingできるようにするべきです.プログラマーが快適になりました.仕事量の保存法則によって、いつもあるものがもっと多くの仕事をするべきです.間違いなく、コンピュータです.
ES 6がサポートされていないブラウザに対応するために、Babelライブラリを導入してES 6コードをES 5にコンパイルして実行します.ES 6をサポートするブラウザに対しては、JavaScriptエンジンで自動的にコンパイル操作が行われます.
したがって、全体的に見て、ES 6とES 5は機能的には同等であり、ES 6で完成できる任務はES 5で必ず達成できます.文法的には、ES 6はより多くの文法飴を提供して、プログラマに味を味わってもらいます.だから、JavaScriptの対象をよりよく理解するために、私達は初心に帰り、ES 5からJavaScriptが創建した対象世界を覗きます.
オブジェクトの作成
オブジェクトには2つの基本的な要素があります.属性と方法です.
属性はデータを保存するためのもので、コードを記憶するための方法です.次に、JavaScriptが作成したオブジェクトの進化史を簡単から複雑に理解します.
Objectオブジェクトを作成し、時代を付与します.new Objectを介してObjectを作成し、その属性と方法のためにオブジェクトを作成できます.
//     1
var p = new Object();
p.name = "x";
p.age = 20;
p.say = function(){
  console.log("My name is",this.name,",this year is",this.age);
}
2つの属性、1つの方法を含むオブジェクトを取得します.p.say()を実行して出力を得る:My name is x ,this year is 20;
しかし、これらのいくつかの行のコードは非常にばらばらで、各行のコードはすべて1本の単独の語句のようで、これらの属性と方法を体現するために全体であり、個々の存在ではなく、次の時代に入る必要があります.
文字の量が時代を賦課する
変数に文字どおりの量を割り当てることで、オブジェクトを作成できます.
//     2
var p = {
  name : "x" ,
  age : 20 , 
  say : function(){
    console.log("My name is",this.name,",this year is",this.age);
  }
}
このように、私達はオブジェクトを作成しました.このオブジェクトは自分の属性と方法を持っています.console.log(typeof p)によって、出力がobjectであることから、pのタイプがオブジェクトであることが分かる.
コードセグメント1とコードセグメント2とは対照的に、コードセグメント2の構造はより合理的であり、すべての属性と方法は大かっこで含まれており、より読みやすく、全体性も表しているが、機能的には同等である.
でも、私達はまた発見しました.毎回似たような対象を作るには、属性名を書く必要があります.非常に優雅ではありません.だから、私達はまた次の時代に入ります.
工場モデル時代
私たちは関数を呼び出して私たちが必要なオブジェクトを作成し、そのオブジェクトに戻すことができます.コードを再利用できます.この関数は伝説の工場です.コードは以下の通りです.
//    3
function createPerson(name,age){
  var t = new Object();
  t.name = name;
  t.age = age;
  t.say = function(){
    console.log("My name is",this.name,",this year is",this.age);
  }
  return t;
}
var p = createPerson("x",20);
コード3はコード1を工場モードに変更します.
コード2も工場モードに変えます.
function createPerson(name,age){
  return {
    name:name,
    age : age,
    say = function(){
      console.log("My name is",this.name,",this year is",this.age);
    }
  };
}
var p = createPerson("x",20);
```
                    ,                      ;

  ,            (              ,              ,     ^_^):

    3            `typeof`  ,      `object`,    `   instanceof  `       `Object` ,   true,   ,  3                ,            ;

     ,           :
```javascript
function seeDoctor( o ){
  if(o  ){
         
  }
  if(o   ){
         
  }
}
```
                   ,            ;

       ,     :
-        ,              `type` ,       ;
-  js          ;

        *  *,           ,       ;          ,            ;

###       

                          ,   `instanceof`           :
```javascript
//       ,  :
//            ,          
function Person(name,age){
  this.name = name;
  this.age = age;
  this.say = function(){
    console.log("My name is",this.name,",this year is",this.age);
  }
}
function Animal(){}
var p = new Person("x",20) ;
```
  ,     ,        **new** 。

  ,     `p instanceof Person`,       `true`,    `p instanceof Animal` ,      `false`,             ;

  ! But,         ,               :
```javascript
var p1 = new Person("x",20);
var p2 = new Person("y",21);
console.log(p1.say==p2.say) ; //     false
```
    :   *say*        ,         *say*           ,     100   ,          100 ,       ,          ,              !

###     +    

                 **  **,              ( c++       ),        ; 

```javascript
function Person(name,age){
  this.name = name;
  this.age = age;
}
Person.prototype.say = function(){
  console.log("My name is",this.name,",this year is",this.age);
}
var p = new Person("x",20);
```
            p       name age,       say;   `p.say()`      :*My name is x ,this year is 20* ;

   `p.say()`    ,p            `say`,   ,   ,    ,            `say`   ,      ,                say  (        say  ,          ),         say  ,     ,  ,        。

p    `p.__proto__`        `Person.prototype` ,                ;

  p         `say`:
```javascript
p.say = function(){console.log("Hello,world");}
```
       **  **     say  ,    `p.say`       *Hello,world* ,      `delete p.say`     `say`   ,    `p.say`  ,            say   ;

  :                        ;

  ,               ,         ,  ,           ;

###       

                  ,                ,        :

```javascript
function Person(name,age){
  this.name = name;
  this.age = age;
  Person.prototype.say = function(){
    console.log("My name is",this.name,",this year is",this.age);
  }
}
var p = new Person("x",20);
```
OK,               ,          ,  ,        :

       Person        ,         `Person.prototype.say`   ,           (     say         ,          ),     cpu    ,             ;

###         

     `Person.prototype.say`        ,               ,      ,       :

```javascript
function Person(name,age){
  this.name = name;
  this.age = age;
  if(typeof(Person.prototype.say)=="undefined"){
    Person.prototype.say = function(){
      console.log("My name is",this.name,",this year is",this.age);
    } ;
  }
}
var p = new Person("x",20);
```
    7      ,      JavaScript                  ; 

 !