前のプロジェクトでは、データ製品を購入してそれらに支払う機能が必要でした。当初、私はオブジェクト指向の文章を使用することを敢えてしませんでした。主な理由は、自分のアイデアを明確にしなかったからです。さらに、その時点でデータ製品は比較的複雑だったので、私はそれらをあえて動かしませんでした。また、オブジェクト指向のライティング方法をオンラインで探し、アイデアを整理し、自分で書きたいと思っていました。
次に、オブジェクト指向のライティングプロセスを段階的に分析します。プロセス全体がほぼ分割されています。
1.最初に、次のような製品リストのデータフォームと合計製品セットを定義します。
var data = [{name: 'name'、unitprice:10、num:2}]; var total = {type:0、totalnum:0、price:0};データアレイ名では単一の製品名を表すことは明らかですが、Unitpriceは単一の製品単位価格を表し、NUMは単一の製品数量を表します。合計オブジェクトタイプは製品タイプを表し、TotalNumは製品の合計量を表し、価格は製品の合計価格を表します。
2。ショッピングカート機能オブジェクトショッピングカートを作成し、次のように対応するプロパティを設定します。
function Shoppingcart(name、unitprice、num){this.name = name; this.unitprice = unitprice; this.num = num; this.info = {name:this.name、unitprice:this.unitprice、num:this.num};};}情報を使用して単一の製品の名前、単価、および数量を保存すると、この情報をデータアレイに入れて、合計製品の総数を計算する必要があるため、この関数オブジェクトの2つの方法を設定する必要があります。 this.infoの下に2つの方法を追加するだけです。
this.add();
this.getTotal();
ここでは、これらの2つの方法が関数オブジェクトのプロトタイプに配置される理由を説明したいと思います。新しいインスタンス化オブジェクトの場合、この製品情報を追加して製品の総数を計算する必要があるため、この2つの方法を呼び出すためにこのインスタンス化オブジェクトを使用する必要はありません。
次に、オブジェクトのプロトタイププロパティを使用し、次のように、このプロパティにすべてのメソッドを入れて呼び出します。
ShoppingCart.Prototype = {//製品追加:function(){var _this = this; data.push(_this.info); }、//合計製品セットgettotal:function(){total.type = data.length; total.totalnum = 0; Total.price = 0; for(var i = 0; i <data.length; i ++){total.totalnum+= data [i] .num; total.price += data [i] .num * data [i] .unitprice; }}}3.追加すると、単一の製品が削除されます。プロトタイプ属性の製品を削除する方法を追加します。製品を削除するには、ロゴに基づいて指定された製品を削除する必要があります。ここでは、名前値を介して削除します。現時点では、次のように、日付配列のこの名前に対応する製品を見つけるための方法が必要です。
//製品delect:function(){var _this = this; data.splice(_this.check(_this.name)、1); _this.getTotal();}、//製品check:function(name){for(var i = 0; i <data.length; i ++){if(name == data [i] .name)return i; }}4.次のように、個々の製品の量を変更します。
//単一の製品changenum:function(num){var _this = this; if(num == 0){_this.delect();戻る; } var _index = _this.check(_this.name); data [_index] .num = num; _this.getTotal();}ここでは、指定された量の製品を設定するためにパラメーターを渡す必要があります。
全体のコードは次のとおりです。
var data = new Array; var total = {type:0、totalnum:0、rice:0}; function shoppingcart(name、unitprice、num){this.name = name; this.unitprice = unitprice; this.num = num; this.info = {name:this.name、unitprice:this.unitprice、num:this.num}; this.add(); this.getTotal();} ShoppingCart.Prototype = {add:function(){var _this = this; data.push(_this.info); }、gettotal:function(){total.type = data.length; total.totalnum = 0; Total.price = 0; for(var i = 0; i <data.length; i ++){total.totalnum+= data [i] .num; total.price += data [i] .num * data [i] .unitprice; }}、delect:function(){var _this = this; data.splice(_this.check(_this.name)、1); _this.getTotal(); }、changenum:function(num){var _this = this; if(num == 0){_this.delect();戻る; } var _index = _this.check(_this.name); data [_index] .num = num; _this.getTotal(); }、check:function(name){for(var i = 0; i <data.length; i ++){if(name == data [i] .name)return i; }}}このデータアレイの初期化データは、バックグラウンドから送信されるデータにすることができますが、データフォームは定義されたものと同じでなければならず、製品の合計セットを取得するにはgettotalメソッドを呼び出す必要があります。
最後に、たとえば、それは単純な新しいインスタンス化です。
var goods1 = new ShopphingCart( '123'、100、2)var goods2 = new Shoppingcart( '456'、10、3)var goods3 = new Shoppingcart( '789'、1、4)goods2.delect(); good3.changenum(2)goods2 = new Shoppingcart( '1234'、11、1)Goods2.Changenum(0)
データを印刷して、結果から合計/(^o^)/〜
上記はこの記事のすべての内容です。みんなの学習に役立つことを願っています。誰もがwulin.comをもっとサポートすることを願っています。