JavaScriptのオブジェクト

JavaScript

オブジェクトとは色々な情報が付随した対象です。 例えば「あなた」というオブジェクトには、身長・体重・髪型・趣味などの様々な特性(プロパティ)が備わっています。

JavaScriptのオブジェクトにおいても同様で、オブジェクトには様々なプロパティやメソッドが付随しています。 JavaScriptでは全てのデータをオブジェクトとして扱います。 変数も関数もオブジェクトです。

オブジェクトのデータを使用する

オブジェクトプロパティの使用

オブジェクトプロパティを使用する書式は以下の通りです。

書式

/プロパティ
var 変数 = オブジェクト名.プロパティ;

変数argに文字列を格納し、lengthプロパティで文字数を調べてみます。

ar arg = "文字数をカウントします";
document.write(arg.length);

11文字だったようです。このようにオブジェクトに付随するプロパティを扱うことができます。

実行結果

1

オブジェクトメソッドの使用

メソッドを使用する場合の書式もプロパティとほぼ同じです。 オブジェクトの後に続くのがプロパティ名かメソッド名かの違いしかありません。

書式

/プロパティ
var 変数 = オブジェクト名.メソッド;

変数argに数字を格納し、toFixed()メソッドで小数点以下の桁を指定数表示させてみます。

ar arg = 34;
document.write(arg.toFixed(3));

34.000と小数点まで表示することができました。このようにオブジェクトはメソッドも使用することができます。

実行結果

4.000

オブジェクトで使用できるプロパティやメソッドはオブジェクトの性質ごとに違います。 例えばtoFixed()は小数点以下を表示するという性質上、数値以外に使えません。 JavaScirpt的に言うと、toFixed()はNumberクラスのオブジェクトなのです。

オブジェクトを定義する

ブジェクトやプロパティは自分で作ることもできます。 オブジェクトは「new」演算子を使うか、オブジェクトリテラルで作成します。 どちらも結果は同じですので、好きな方を使ってください。

書式

ar obj = new Object();
var obj = {}; //この定義の仕方を「オブジェクトリテラル」と言います

オブジェクトは「.」でオブジェクトとプロパティをつなげて定義します。 プロパティ名は任意のものを何個でも作ることが可能です。

書式

ar obj = new Object();
obj.property = num;
obj.property2 = num;
・・・
document.write(obj.property);
ar you = new Object();
you.height = 170;
you.weight = 70;
document.write('あなたは身長' + you.height + 'cm、体重' + you.weight + 'kgです。');

実行結果

code title=""]
あなたは身長170cm、体重70kgです。

同じことを以下ように記述することもできます。色々書き方はありますが、まあ好きなように書けばいいんじゃないかと。

書式

ar obj = new Object(property:num,property2:num2);
document.write(obj['property']);
ar you = {height:170,weight:70};
document.write('あなたは身長' + you['height'] + 'cm、体重' + you['weight'] + 'kgです。');

実行結果

code title=""]
あなたは身長170cm、体重70kgです。
eyecatch

JavaScriptの正規表現

eyecatch

jQueryライブラリを読み込む

JavaScriptの記事

eyecatch

JavaScriptの条件分岐

eyecatch

JavaScriptとは

eyecatch

JavaScriptのDOM

eyecatch

JavaScriptの関数記述と呼び出し

eyecatch

JavaScriptの繰り返し処理

eyecatch

画像ポップアップとスワイプ可能なプラグイン「baguetteBox.js」

JavaScriptの記事一覧HOME