VUE3.0 をすぐに始める方法: 学習に入る
関連する推奨事項: JavaScript チュートリアル
コンストラクターとは: JavaScript でオブジェクトを作成するもう 1 つの方法です。
リテラル メソッドを使用したオブジェクトの作成と比較してください。コンストラクターは、同じ特性を持ついくつかのオブジェクトを作成できます。
例: フルーツ コンストラクターを使用して、リンゴ、バナナ、オレンジのオブジェクトを作成します。その特徴は、これらのオブジェクトがすべて同じテンプレートに基づいて作成されており、それぞれのオブジェクトが独自の特性を持っていることです。
リテラルメソッドを使用してオブジェクトを作成することの特徴と利点
: 単純さと柔軟性。
欠点: 同じ特性を持つオブジェクトのセットを作成する必要がある場合、これらのオブジェクトに共通するメンバーをコードを通じて指定することはできません。
オブジェクト指向プログラミング言語でテンプレートを実装する方法は、クラスを使用してテンプレートを作成し、そのテンプレートに基づいてさまざまなオブジェクト (クラスのインスタンス) を実装することです。
JavaScript でテンプレートを実装する方法 1: ファクトリ関数を使用して、内部にリテラル "{ }" を使用してオブジェクトを作成します。欠点は、オブジェクトのタイプを区別できないことです。
JavaScript でテンプレートを実装する方法 2: コンストラクターを通じてオブジェクトを作成します。
コンストラクターをカスタマイズする方法を学ぶ前に、まず JavaScript の組み込みコンストラクターの使用方法を見てみましょう。
: コンストラクターをカスタマイズするにはどうすればよいですか?
JavaScript を学習するとき、初心者は関数、メソッド、コンストラクター、コンストラクター、コンストラクターなどの類似した用語に混乱することがよくあること
に注意してください。
実際、これらはすべてまとめて関数と呼ぶことができますが、使用シナリオごとに異なる名前が付けられます。慣例により、オブジェクト内で定義された関数はオブジェクトのメソッドと呼ばれます。
コンストラクターについては、コンストラクターまたはコンストラクターと呼ぶことに慣れている人もいます。これらの名前が同じものを指すことを理解するだけで十分です。
ES6 より前に利用できなかった理由: 難しさを単純化するためです。
追加理由:Webフロントエンド技術の発展に伴い、元々バックエンド開発に従事していた人の一部がフロントエンドに転向するようになりました。 JavaScript を一部のバックエンド言語の構文に近づけて、開発者がより早く適応できるようにするため。
class キーワードの役割: クラスを定義するために使用されます。
特徴: クラス内にコンストラクタコンストラクタメソッドを定義できます。
クラス構文は本質的に糖衣構文であり、前に学習したコンストラクターなど、ユーザーが使いやすいように設計されているだけであること
に注意してください
。ユーザーのブラウザがこの構文をサポートしていない場合、この方法はお勧めできません。
: コンストラクターでは、var キーワードを使用して定義された変数をプライベート メンバーと呼びます。
特徴: インスタンス オブジェクト以降は、「object.member」を通じてアクセスできませんが、プライベート メンバーにはオブジェクトの member メソッドでアクセスできます。
機能: プライベート メンバー名はオブジェクト指向のカプセル化を反映しています。
これは、これらのオブジェクトが実際にはコンストラクター String のインスタンス、つまり String オブジェクトであるためです。
文字列を操作する場合、処理結果はメソッドの戻り値を通じて直接返され、String オブジェクト自体に格納されている文字列の内容は変更されないことに
注意してください
。これらのメソッドのパラメーターでは、位置は 0 から始まるインデックス値であり、最初の文字のインデックス値は 0、最後の文字のインデックス値は文字列の長さから 1 を引いたものになります。
ユーザー名の長さを 3 ~ 10 に制限し、機密性の高い単語 admin をデモンストレーションに使用できないようにする例を考えてみましょう。
Number オブジェクトは、整数、浮動小数点数、その他の数値を処理するために使用されます。一般的に使用されるプロパティとメソッドは次のとおりです。
これは Number の静的メンバーであり、Number のインスタンスではなく、コンストラクター Number を通じて直接アクセスされます。
Math オブジェクトは、他のオブジェクトとは異なり、数値に対して数学的演算を実行するために使用されます。このオブジェクトはコンストラクターではないため、使用するためにインスタンス化する必要はありません。
例として、指定された範囲内の乱数を取得する Math.random() を取り上げます。
式は Math.random() * (n - m) + m です。これは、m 以上で n 未満のランダムな値を生成することを意味します。
Date オブジェクトは、日付と時刻を処理するために使用されます。
例 1: Date オブジェクトに基づいて時刻と日付を取得します。
例 2: Date オブジェクトに基づいて日付を指定します。
例 3: 設定された日付が不合理である場合の対処。たとえば、月を -1 に設定すると昨年の 12 月を意味し、月を 12 に設定すると来年の 1 月を意味します。
コード実装のアイデア:
コード実装
<html> <head><title>今月のカレンダー</title> </head> <本文> <p align=center><b>今月のカレンダー</b></p> <スクリプト> var 今年、今月、今日=新しい日付();; thisyear=today.getFull Year() thismonth=today.getMonth(); var imonth、iweekday、iday、nextday; document.write("<table align=center border=1><tr align=center bgcolor=#fff00>") document.write("<td>日曜日</td><td>月曜日</td><td>火曜日</td><td>水曜日</td><td>木曜日</td><td>金曜日< /td><td>土曜日</td>") document.write("</tr><tr>") 翌日=1; var thisdate=新しい日付(今年,今月,翌日) for (iday=0;iday<=6;iday++){ if (thisdate.getDay() > iday) { document.write("<td>"); document.write("</td>") } それ以外 { if (thisdate.getMonth()== today.getMonth()&&thisdate.getDate()== today.getDate() &&thisdate.getFull Year()== today.getFull Year() ){ document.write("<td><font color=red><b>") document.write(翌日) document.write("</font></b></td>") } それ以外 { document.write("<td><b>"); document.write(翌日); document.write("</b></td>"); } 次の日=次の日+1; thisdate.setDate(翌日); } } document.write("</tr>"); document.write("<tr>") iweekday=1 while(thisdate.getMonth() == 今月 ){ if (thisdate.getMonth()== today.getMonth()&&thisdate.getDate()== today.getDate() &&thisdate.getFull Year()== today.getFull Year() ){ document.write("<td><font color=red><b>") document.write(翌日) document.write("</b></font></td>") } それ以外{ document.write("<td><b>") document.write(翌日) document.write("</b></td>") } 次の日=次の日+1; iweekday=iweekday+1; if (iweekday>7 ){ iweekday=1; document.write("</tr>"); } thisdate.setDate(翌日); } </script> </body> </html>
関連する推奨事項: JavaScript 学習チュートリアル。
詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。