JavaScript設計モード(1)——対象に対するプログラミング

原文は本人の個人ブログサイトから来ました.https://www.dzyong.com(訪問歓迎)
本論文のリンク先:https://www.dzyong.com/#/View...
オブジェクトに対してプログラミングするのは、プログラム設計のモデルです.プログラムの基本単位としてオブジェクトをパッケージ化し、プログラムの再利用性、柔軟性、拡張性を向上させます.
私たちは一例で勉強を始めます.需要:ユーザーが入力したユーザー名、メールボックス、パスワードなどを検証する.
この需要を実現するのは簡単です.白の書き方は:

function checkName() {
    //    
}
function checkEmail() {
    //    
}
function checkPassword() {
    //    
}

これは関数の形式で検証していますが、この書き方のリスクが大きいので、個人開発であれば問題はないですが、チーム開発であれば、他の人も同じ方法を定義すれば、既存の機能をカバーします.この3つの関数は大域変数に属しているからです.
オブジェクトで変数を編集
このような問題を回避するために、オブジェクト編集変数を使用することができます.

var CheckObject = {
    checkName : function(){
        //    
    },
checkEmail : function(){
        //    
    },
checkPassword : function(){
        //    
    },
}

このとき、すべての関数をCheckObjectオブジェクトとする方法は、オブジェクトが一つしかないので、それを使うのも簡単です.例えば、CheckObject.checkName()という名前を検出するのは、前のオブジェクトの名前だけです.
オブジェクトの別の形式
オブジェクトには別の形式があります.オブジェクトを先に宣言して、それに方法を追加してもいいです.

var CheckObject = function(){}
CheckObject .checkName = function() {
    //    
}
CheckObject .checkEmail = function() {
    //    
}
CheckObject .checkPassword = function() {
    //    
}

真贋の相手
このオブジェクトをコピーしたいなら、このように書いてもいいです.

var CheckObject = function(){
    return {
        checkName ： function(){ //      },
        checkEmail ： function(){ //    },
        checkPassword ： function(){ //    },
    }
}

このようにする利点は、この関数を呼び出すたびに、前のオブジェクトを戻し、他の人がこの関数を呼び出すたびに新しいオブジェクトを返します.このようにして、一人一人が使う時にはお互いに影響がありません.

var a = CheckObject ();
a.checkName ();

クラスでもいいです
新しいオブジェクトを作成して需要を完了しましたが、本当にクラスの作成方式ではなく、作成したオブジェクトaとオブジェクトCheckObjectは何の関係もありません.これから作成します.

var CheckObject = function(){
    this.checkName = function(){  //      }
    this.checkEmail = function(){  //      }
    this.checkPassword = function(){  //      }
}

クラスの作成方法は対象のようにはできません.クラスである以上、キーワードnewで作成します.

var a = new CheckObject ();
a.checkName ();

検出クラス
すべての方法は関数の内部に置いてあります.thisで定義されていますので、newキーワードで新しいオブジェクトを作成するたびに、新しく作成したオブジェクトはクラスのthis上の属性をコピーします.だから、これらの新規作成の対象は全部自分なりの方法があります.しかし、こんなに多くの場合、消耗はとても贅沢です.処理したいです.

var CheckObject = function(){}
CheckObject .prototype.checkName = function(){  //      }
CheckObject .prototype.checkEmail = function(){  //      }
CheckObject .prototype.checkName = checkPassword (){  //      }

このようにオブジェクトのインスタンスを作成する時、作成したオブジェクトが持つ方法は全部同じです.プロトタイプの原型に依存して探しています.見つけた方法は全部同じです.彼はCheckObjectオブジェクト類の原型に結び付けられています.もちろん上の方法を簡略化してもいいです.

var CheckObject = function(){}
CheckObject .prototype = {
    checkName ： function() {  //      },
    checkEmail ： function() {  //      },
    checkName ： function() {  //      },
}

ただし、この2つの方法は混ぜてはいけません.そうでないと、後で対象となるプロトタイプのオブジェクトに新しいオブジェクトを割り当てる場合、上書きされる前にプロトタイプのオブジェクトに値を付ける方法です.
前と同じ方法で使います.

var a = new CheckObject ();
a.checkName ();
a.checkEmail ();
a.checkName ();

方法はまたこのように使うことができます.
前のベースでは、さらに最適化することができますが、3つの方法を呼び出すと、私たちは3回aを書く必要があります.これは避けられます.ステートメントの各方法の末尾に現在のオブジェクトに戻ります.

var CheckObject =  {
    checkName ： function() {  //      return this； },
    checkEmail ： function() {  //      return this； },
    checkName ： function() {  //      return this； },
}

私達はこのように使うことができます.

CheckObject .checkName().checkEmail().checkName()

簡潔になったという感じですか?もちろん同じ方法でクラスの原型の対象にも入れられます.

var CheckObject = function(){}
CheckObject .prototype = {
    checkName ： function() {  //      return this； },
    checkEmail ： function() {  //      return this； },
    checkName ： function() {  //      return this； },
}
var a = new CheckObject();
a.checkName().checkEmail().checkName()

関数の祖先
prototype.jsはJavaScriptのフレームであり、中には便利なパッケージ化がたくさんあります.最大の特徴は、ソースオブジェクト(Function、Aray、Objectなど)の拡張が可能です.例えば、関数を一つ追加したいなら、メールで検出する方法はこうしてもいいです.

Function.prototype.checkEmail = function(){
    //    
}

この方法を使うと便利です.
関数の形式

var a = function(){}
a.checkEmail ();

クラスの形式

var a = new Function()；
a.checkEmail ();

しかし、安全のために、私たちはこのようにしてはいけません.ソースのオブジェクトFunctionを汚染し、不必要な出費を引き起こすので、統一的な添加方法の機能を抽象化できます.

Function.prototype.addMothed = function(name, fn) {
    this[name] = fn
}

次のようにあなたの方法を追加することができます.

var motheds = function() {}      var motheds = new Function()
motheds.addMothed('checkEmail ', function(){  //       })

同じチェーンでも追加できます.

Function.prototype.addMothed = function(name, fn) {
    this[name] = fn；
    return this；
}
motheds.addMothed('checkEmail ', function(){  //       })
.addMothed('checkName', function(){  //       })

戻り方のthisで実現します.

motheds.addMothed('checkEmail ', function(){  //       return this;  })

クラスの呼び出しを使う

Function.prototype.addMothed = function(name, fn) {
    this.prototype.[name] = fn；
    return this；
}

クラスを使用する場合は、直接には使用できず、newキーワードでオブジェクトを作成する必要があります.

var m = new Methods();
m.checkEmail ()

原文は本人の個人ブログサイトから来ました.https://www.dzyong.com(訪問歓迎)
転載はソースを明記してください.鄧占勇さんの個人ブログ
本論文のリンク先:https://www.dzyong.com/#/View...