javascript対象プログラムに向かって高級な特性経典教程を設計する(コレクションに値する)

8141 ワード

本論文の実例は、Javascriptのオブジェクト指向プログラミングの高級な特性を述べている.皆さんに参考にしてあげます.具体的には以下の通りです.
1.オブジェクトを作成する3つの方法:
第一の構造法:new  Object

var a = new Object();
a.x = 1, a.y = 2;

第二の構造法:対象直接量

var b = { x : 1, y : 2 };

第三の構造法:定義タイプ

function Point(x, y){
 this.x = x;
 this.y = y;
}
var p = new Point(1,2);

2.訪問先
訪問先の属性の括弧表示法:hero['name]、ポイント表示法:hero.name.アクセスのプロパティが存在しない場合は、undefinedを返します.オブジェクトにアクセスする方法名の後に括弧を合わせます.hero.say().アクセス属性のようなアクセス方法:hero['say'()です.
3.属性と方法の削除

//       
var hero = {};
// hero         
hero.name = "JavaScript";
hero.value = "helloworld";
hero.sayName = function(){return "hello " + hero.name;};
//  
alert(hero.name); //output javascript
alert(hero.sayName()); //output hello javascript
//  hero   name  
delete hero.name;
//  
alert(hero.sayName()); //output hello undefined

4.this値を使う

//       
var hero = {};
// hero         
hero.name = "javascript";
hero.value = "helloworld";
hero.sayName = function(){return "hello " + this.name;};
//  
alert(hero.name); //output javascript
alert(hero.sayName()); //output hello javascript

まとめ:
①ここのthisは、実際に「このオブジェクト」または「現在のオブジェクト」を参照します.②thisの使い方は、ほとんどの人が使う問題が多いです.あまり多く使うことを勧めません.
5.建設対象
建設対象は大きく三つのグループに分けられます.
①データパッケージ類の対象は、Object、Aray、Boolean、Number、Stringを含む.これらのオブジェクトは、javascriptにおける異なるデータタイプを表し、それぞれのtypeof戻り値とundefinedとnull状態を有する.
②ツールクラスのオブジェクトは、Math、Date、RegExpなどを含んで、巡回の対象を提供します.
③エラー種別のオブジェクト――一般的なエラーオブジェクトおよびその他のより特殊なエラー種別のオブジェクトが含まれます.これらはいくつかの異常が発生した時にプログラムの動作状態を修正してくれます.
6.Objectオブジェクト
Objectはjavascriptのすべてのオブジェクトの親レベルのオブジェクトであり、これはすべてのオブジェクトがObjectのオブジェクトに受け継がれることを意味する.
空のオブジェクトを作成:

var object = {};
var obj = new Object();

7.Arayオブジェクト
Arayオブジェクトは、単一の変数に複数の値を格納するために使用されます.
空のArayオブジェクトを作成します.

var object = {};
var obj = new Array();

例えば1:

//       
//       
var str = "a,b,c,d,e,f,g";
//  String   split()  ,           
var arr = str.split(",");
//  Array   reverse()  ,           。
arr = arr.reverse();
//    
alert(arr.toString());

8.Stringオブジェクト
Stringオブジェクトと基本的な文字列タイプの違い:

var str = "hello";
var obj = new String("world");
alert(typeof str); //typeof string
alert(typeof obj); //typeof object

例えば1:

//                
//           
var str = "abcdefg";
var substr = "efg";
/*
*                    
*  *      :       
*  *      :      
*/
function sub(str,substr){
//          String  
var string = new String(str);
//        
var result = string.substr(string.indexOf(substr),substr.length);
/*
*              
*  *   ,          
*  *    ,         
*/
if(result==substr){
return true;
}else{
return false;
}
}
alert(sub(str,substr));

9.プロトタイプ
関数自体も方法と属性を含むオブジェクトです.今私たちが研究しているのは関数オブジェクトのもう一つの属性――prototypeです.
プロトタイプの追加方法と属性を利用して、自分の属性でプロトタイプの属性を書き換えます.
以下に新しい関数オブジェクトを作成し、属性と方法を設定します.

function Hero(name, color){
 this.name = name;
 this.color = color;
 this.whatareyou = function(){
 return "I am a " + this.color + " " + this.name;
 }
}
var hero = new Hero("javascript","red");
alert(hero.whatareyou()); //output I am a red javascript

上記のHero関数オブジェクトにいくつかの属性と方法を追加します.

Hero.prototype.price = 100;
Hero.prototype.rating = 3;
Hero.prototype.getInfo = function(){
 return "Rating: " + this.rating + " , Price: " + this.price;
}
alert(hero.getInfo()); //output Rating: 3 , Price: 100

上記の方法は、このようにしてもいいです.

Hero.prototype = {
 price : 100,
 rating : 3,
 getInfo : function(){
   return "Rating: " + this.rating + " , Price: " + this.price;
 }
};

自身の属性を使ってプロトタイプの属性を書き換えます.
相手の自身の属性と原型の属性が同名だったらどうしますか?答えはオブジェクト自身の属性の優先度が原型の属性より高いことです.

function Hero(){
 this.name = "jscript";
}
Hero.prototype.name = "javascript";
var hero = new Hero();
alert(hero.name); //output jscript
delete hero.name;
alert(hero.name); //output javascript

拡張する

//    Array           
Array.prototype.inArray = function(color){
 for(var i = 0, len = this.length; i < len; i++){
 if(this[i] === color){
 return true;
 }
 }
 return false;
}
//    Array  
var a = ["red", "green", "blue"];
//  
alert(a.inArray("red")); //true
alert(a.inArray("yellow")); //false

10.継承
二つのクラスが同じインスタンスのタイプである場合、それらの間に何らかの関係が存在し、同じインスタンスのタイプ間の一般化関係を「継承」と呼ぶ.
継承関係は少なくとも3つの意味を含みます.
①サブクラスの例は、親の方法を共有することができます.②サブクラスは親タイプの方法をカバーしたり、新しい方法を拡張したりできます.③サブクラスと親タイプは、いずれもサブクラスのインスタンスの「タイプ」です.
javascriptでは「継承」はサポートされていません.つまり、javascriptには引き継がれていない文法です.この意味では、javascriptは直接的な対象言語ではない.
11.プロトタイプチェーン
プロトタイプチェーンはECMAScript標準で制定されたデフォルトの継承方式です.
たとえば:

function A(){
this.name = "a";
this.toString = function(){return this.name};
}
function B(){
this.name = "b";
}
function C(){
this.name = "c";
this.age = 18;
this.getAge = function(){return this.age};
}
B.prototype = new A();
C.prototype = new B();

説明:
オブジェクトを直接Bオブジェクトのプロトタイプ属性に作成し、これらのオブジェクトの元のプロトタイプを拡張しませんでした.
new A()によって新たなエンティティが作成され、そのオブジェクトのプロトタイプをカバーします.
javascriptは完全に対象に依存する言語で、クラスの概念がない.
したがって、直接にnew A()を用いてエンティティを作成し、その後、そのエンティティの属性によって関連する継承作業を完了する必要がある.
このような継承の実現が完了した後、A()に対する修正、書き換え、または削除は、B()に影響を与えません.
原型のみ継承:

function A(){}
A.prototype.name = "a";
A.prototype.toString = function(){return this.name};
function B(){}
B.prototype = A.prototype;
B.prototype.name = "b";
function C(){}
C.prototype = B.prototype;
C.prototype.name = "c";
C.prototype.age = 18;
C.prototype.getAge = function(){return this.age};

オブジェクト間の継承(拡張された内容は、できません)(浅いコピー)

//                
function extendCopy(p){
 var z = {}; //        z
 for(var i in p){ //var i =0 ; i < p.length ; i++
 z[i] = p[i]; //         ,    
 }
 //uber  : p  z   , z  p   
 z.uber = p;
 return z;
}
//    a,    a       
var a = {
 name : "a",
 toStr : function(){return this.name;}
}
//    b,    b       
var b = extendCopy(a);
b.name = "b";
b.toStr = function(){return this.uber.toStr() + " , " + this.name;};
//    c,    c       
var c = extendCopy(b);
c.name = 18;
alert(c.toStr()); //output a , b , 18

PS:チュートリアルのコードの多くはレイアウトがあまり規範化されていません.ここでは、いくつかの本駅のjavascriptコードのフォーマット美化ツールを紹介します.
JavaScriptコードフォーマットツール:
http://tools.jb51.net/code/js
JavaScriptコード美化/圧縮/フォーマット/暗号化ツール:
http://tools.jb51.net/code/jscompress
jsminオンラインjs圧縮ツール:
http://tools.jb51.net/code/jsmincompress
JavaScriptの関連内容については、当駅のテーマを見ることができます.「javascript対象入門教程」、「JavaScript中json操作技術まとめ」、「JavaScript切替特効と技巧まとめ」、「JavaScript検索アルゴリズム技術まとめ」、「JavaScriptアニメーション特効と技巧まとめ」、「JavaScriptエラーとデバッグ技術まとめ」、まとめ「JavaScriptデータ構造とアルゴリズム技術のまとめ」、「JavaScript巡回アルゴリズムと技術のまとめ」及び「JavaScript数学演算用法のまとめ」
本論文で述べたように、JavaScriptプログラムの設計に役に立ちます.