ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScriptでのオブジェクト作成を詳しく解説

JavaScriptでのオブジェクト作成を詳しく解説

黄舟
黄舟オリジナル
2016-12-14 16:07:511286ブラウズ

JavaScript はオブジェクト指向言語であることはわかっていますが、もちろんオブジェクト操作なしでは機能しません。この記事では、JavaScript でオブジェクトを作成する方法について説明します。

本質的に、オブジェクトを作成するという考え方は、多くのプロパティとメソッドを含む単純なエンティティを作成することです。
以下はオブジェクトコンストラクターの例です:
function person(name, age, colour) {
this.name = name;
this.age = age;
this.colour = colour;
}
そうすると、こんなことができます。次のように実行します: Person コンストラクターを呼び出します:
var somebody = new Person("Patrick", 22, "red"); または、ユーザーから入力値を取得します: var pName = prompt("What is your name?") ; var pAge = プロンプト("今年何歳ですか?");
var pColour = プロンプト("あなたの好きな色は何ですか?");
var somebody = new person(pName, pAge, pColour);
すべて入りますjavascript コンストラクターは、Java と同様に、new キーワードを使用して呼び出すことができます。プロパティ {"Patrick", 22, "red"} を使用して人が作成 (または構築) されると、次のような値にアクセスできます:
somebody.name、または somebody["name"] "Patrick"
somebody.age、or somebody["age"] 22
somebody.colour、or somebody["colour"] "red"
person 属性の追加に name を使用するため、それらは name によって参照される必要があります。以下のコード。数字を使用する場合は、someone.name の代わりに somebody[0] など、参照に数字を使用する必要があります。
JavaScript の配列とオブジェクト (フォーム、画像、フレームなど) では、これら 2 つのメソッドが使用できます。
さらに、配列とオブジェクトの両方には、長さという重要な属性があります。プログラミングするときは、objectName.length のように使用できます。これは、オブジェクトに含まれる要素または属性の数を返します。
関数から属性を作成することもできます。この方法では、
function person(name, age, colour)
{
this.name = name;
this. という 1 行を Person 関数に追加するだけで済みます。 age = age;
this.colour = colour;
this.birthyear = (new Date()).get Year() - this.age;
}
上記の person 関数は、各 A 人の 4 番目の属性、birthyear を定義します。生年。この追加行は組み込みの Date コンストラクターを呼び出し、現在の日付と時刻を含む Date オブジェクトを返すことに注意してください。
これは、Date 変数にアクセスするための非常に怠惰な方法です。したがって、次のコードを使用すると、より正確で読みやすくなります:
var today = new Date();
this.birthyear = today.getyear() - this.age;
もちろん、JavaScript を使用してこれを行う方法はたくさんあります。プログラムは「圧縮」を実行します。コードにオブジェクトを挿入することで、ほとんどの変数を処理できます。
この Date オブジェクトは、アクセスメソッド (accessor/get) と操作メソッド (manipulator/set) が含まれているため、上で定義した person オブジェクトよりも複雑です。同時に、JavaScript に単純なオブジェクト メソッドを追加することもできます。詳細なコード例は次のとおりです。

Person オブジェクトの Person.toString() メソッドをオーバーロードすることで、 Person を使用できます。 object as 文字列が表示されます。 Person オブジェクトが文字列として参照される場合は常に、springperson によって返される値によって表示される内容が決まります。
上記のスクリプトの出力は次のとおりです:
パトリックは76年生まれ
で22歳
ベティは77年生まれ
で21歳 1976年には76歳でしか代表されませんでした。したがって、2 桁の前に「19」を追加するとよいでしょう。残念ながら、2000 年問題のせいで対処が少し難しくなります。ブラウザーが異なれば、Date オブジェクトの get Year() メソッドの処理方法も異なります。
年 (西暦)
ナビゲーター ブラウザ
IE 3.x ブラウザ
IE 4.x ブラウザ
上記の表から、最新のブラウザは 1999 年以降の 4 桁の年形式 (2000 年、2001 年など) をサポートしていることがわかります。残念ながら、古いブラウザが年の形式を処理する方法は、プログラマーに際限のない混乱を引き起こします。私がよく使う具体的な解決策は次のとおりですので、皆さんにも共有したいと思います:
var this Year = (new Date()).get Year();
this Year = 1900 + (this Year % 1900);
The function of ( this Year % 1900) は、年を IE 3 に変換します。上記の 2 つのステートメントは 1900 から 3799 までの処理に適用できます。今では、このくらいの長い時間で十分であるように思えます。ただし、「Y2K」問題と同様の問題を回避するには、より良い解決策を見つける必要がありますが、このチュートリアルでは説明しません。さらに、新しい ECMA 標準には、完全な年の形式を返す getFull Year() という関数が含まれていますが、この関数は Navigator 4 でのみサポートされており、IE では使用できません。
最後に、プログラムをいくつか改善するために、People コンストラクターを変更して、年を YYYY 形式に変換します。具体的なコードは次のとおりです。
this.birthyear = 1900 + (((new Date()).getyear( ) - this.age) % 1900);
JavaScript でオブジェクトを使用する機能は、多くのプログラマーによって見落とされがちです。しかし、このチュートリアルから、オブジェクトを使用することでプログラマがより強力なアプリケーションを設計できることがわかるはずです。

その他の関連記事については、PHP 中国語 Web サイト (www.php.cn) に注目してください。


声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。