ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScript 上級章: クロージャ、シミュレーション クラス、継承 (5)_javascript スキル

JavaScript 上級章: クロージャ、シミュレーション クラス、継承 (5)_javascript スキル

WBOY
リリース: 2016-05-16 17:54:33
オリジナル
1151 人が閲覧しました

1. JavaScript のクロージャ
1. まず、関数のスコープが何であるかを理解しましょう。

2. 呼び出されたオブジェクト

組み合わせ例:

コードをコピー コードは次のとおりです:

function display( something)
{
functionexecuteDisplay1()
{
document.write("私は上司の印刷を手伝っています:" something "
");//something外部関数を参照します パラメータ
}
executeDisplay1();//関数表示は内部関数を参照します
}
display("sorry");//実行後、これは次によってリサイクルされますガベージコレクター

3. クロージャーの形成

例 1、

コードをコピーします コードは次のとおりです。

var obj = {};//グローバル オブジェクト
function buyHouse(price,area)
{
return function(){return "支払いたい価格:"price*area;};内部関数を戻り値として配置します。
}
obj.people = buyHouse(12000,80); //内部関数の参照を obj オブジェクトの people 属性に保存します。
//これはクロージャ、つまり単純な式を形成します。返される値を使用するか、オブジェクトのプロパティに保存するかに関係なく、入れ子になった関数の参照をグローバル スコープに保存します。
document.write(obj.people() "
");

例 2、
コピーコード コードは次のとおりです。

function add()
{
var number = 0; return function(){return; number;} ;//
}
var num = add();//ここでは 4 つの参照がありますね。最初の参照はアクセス関数であり、2 番目の参照は外部関数を指します。 to Add( ) は匿名関数を参照します)
//3 番目は匿名関数 (つまり、return 関数...Add のローカル変数を参照します)、4 番目はグローバル オブジェクト (変数番号)。
//グローバルオブジェクトへの各呼び出しのオブジェクトは関数本体に保存されるため、ローカル変数の値は維持されます。
document.write(num());

//同等のメソッド
num2 = (function(){var number = 0;return function(){return number;}}) () ;//グローバル オブジェクトに直接割り当てられた匿名関数
document.write(num2());

例 3、プライベート属性の実装

コードをコピー コードは次のとおりです:
//クロージャを使用してプライベート プロパティを実装します
function createProperty(o,propertyname,check)
{
var value;
o["get" propertyname] = function(){return value;};//匿名関数本体をオブジェクトのプロパティに返します
o["set" propertyname ] = function(v){if(check && !check)//パラメータの正当性をチェックします throw("パラメータが正しくありません!");
else value = v;//匿名関数の本体を返しますオブジェクトのプロパティ
}
var o = {};
createProperty(o,"Age",function(x){return typeof x == "number";});//続いて An検証作業を実行し、数値でない場合は false を返す匿名関数
o.setAge(22); // オブジェクトのプロパティを使用します
document.write(o.getAge());
//実際には、関数はグローバル オブジェクトのプロパティに保存されます。


2. JavaScript のクラス
まずは基本的な用語から始めましょう。
1. プロトタイプ

実際、オブジェクトのプロトタイプはコンストラクターのプロトタイプ値です。関数が作成されると、それが自動的に作成され、初期化されます。値はオブジェクトです。このオブジェクトにはコンストラクターと呼ばれるプロパティがあり、プロトタイプに関連付けられたコンストラクターを指します。


コードをコピー コードは次のとおりです:

関数 PeopleHope(お金,家)
{
this.money = お金;
this.house = 家;
}
PeopleHope.prototype.hope = function( ){document.write("お金と家を所有したい");};//これはプロトタイプであり、コンストラクターによってオブジェクトのプロパティに初期化されます。
for(var p in PeopleHope.prototype)
{
document.write("プロトタイプが出ました! t " p "
");//出力: プロトタイプが出てきました! Hope
}

2. シミュレーション クラス

実際には、JavaScript の「クラス」は単なる関数です。コードにジャンプするだけです。
コードをコピーします コードは次のとおりです。

function PeopleHope(money,house)
{
this.money =money;
this.house = house;
PeopleHope.VERSION = 0.1//クラスの属性
PeopleHope.createLive = function(){document.write("党のリーダーシップで 次に、私たちの生活はとても良いです! ");}//クラスメソッドはクラスへの直接参照である必要があります
}

3. クラスの継承
コードをコピーします コードは次のとおりです:

function CreateClass(name,version)
{
this.name = name; //初期化オブジェクト属性
this.version= バージョン
CreateClass.AUTHOR = "Frank";//クラス属性
CreateClass.SellHouse = function(){document.write; (「当社は大手不動産会社 Vanke です」) ;};//クラスメソッド
CreateClass.prototype.Company = "vanke";
CreateClass.prototype.HousePrice = function(){document.write("ダメイシャの頂上にある高級住宅が最高販売価格の 5,000 万で販売されました! ");};
//プロトタイプ、実際、この時点で、このプロトタイプとクラス メソッドの違いは何なのかと疑問に思うかもしれません。 ?
//実際: たとえば、 var o = new CreateClass("COFCO Real Estate", "Phase 1"); CreateClass 関数のこれは o であり、これらを合わせると
//o.name = " COFCO不動産" ";o.version = "問題 1";こちら!
//プロトタイプが実際に何をしているかというと、オブジェクト o を作成するときに、プロトタイプはコンストラクターに初期化を一緒に取り除くように指示します。
// になります。オブジェクトまたはプロパティ。
}
function House(name,version,city)
{
CreateClass.apply(this,[name,version]);//継承されたコンストラクター
this.city = city; 🎜>House.prototype.housename = "Peninsula Garden";
}
House.prototype = new CreateClass("COFCO Real Estate", "Phase II");// new を通じて CeateClass 属性を取得します。 prototype object
//関数のプロトタイプ属性を出力します
function displayPrototype(c)
{
for(var x in c.prototype)
{
document.write(x) "
");
}
}
displayPrototype(House);//出力: HousePrice 会社名バージョン
//プロトタイプではないオブジェクトを削除
delete House .prototype.name; //削除
delete House.prototype.version; //
displayPrototype(House) を削除します。 //出力: HousePrice Company
var customer("Peninsula Garden","フェーズ 3"," 西側抜歯");
for(var t in Customers)
{
if(typeof Customers[t] == "function")// であるかどうかを判断しますfunction
{
customers[ t]();//Execute
Continue;//今回は戻って次のサイクルに進みます
}
document.write(t ":t" Customers[t] "
");
// 出力ハウス名: ペニンシュラガーデン 会社: vanke 大梅沙の頂上にある邸宅が最高額の 5,000 万元で販売されました!名前: ペニンシュラガーデン バージョン: フェーズ 3 都市: Xijia
//継承が実現します。プロトタイプを通じて。

概要: この記事をここで共有します。元々は共有する名前空間がありました。学習スケジュールの都合上、ここで Javascript 構文を共有します。

次回は、JavaScript クライアントと Jquery などの高度なアプリケーションのプログラミングを共有します。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート