JavaScript オブジェクト

JavaScript オブジェクト

JavaScript では、文字列、値、配列、関数などすべてがオブジェクトです

さらに、JavaScript ではカスタム オブジェクトも使用できます。

すべてはオブジェクトです

JavaScript には、String、Date、Array などの複数の組み込みオブジェクトが用意されています。 オブジェクトは、プロパティとメソッドを備えた特別なデータ型にすぎません。

ブール型はオブジェクトになることができます。数値型はオブジェクトにすることができます。文字列もオブジェクトになることができます。数学や正規表現もオブジェクトになります。

オブジェクトは単なるデータです。オブジェクトにはプロパティとメソッドがあります。

オブジェクトのプロパティへのアクセス

プロパティは、オブジェクトに関連付けられた値です。

オブジェクトのプロパティにアクセスするための構文は次のとおりです:

objectName.propertyName

この例では、String オブジェクトの長さプロパティを使用して文字列の長さを取得します:

var message="Hello World!";

var x= message.length ;


上記のコードが実行されると、x の値は次のようになります:

12

オブジェクトにアクセスするメソッド

メソッドは、オブジェクトに対して実行できるアクションです。

次の構文でメソッドを呼び出すことができます:

objectName.methodName()

この例では、String オブジェクトの toUpperCase() メソッドを使用してテキストを大文字に変換します:

var message="Hello world!" ;

var x=message.toUpperCase();


上記のコードが実行されると、x の値は次のようになります:

HELLO WORLD!

JavaScript オブジェクトの作成

JavaScript を使用すると、独自のオブジェクトを定義して作成できます。

新しいオブジェクトを作成するには 2 つの異なる方法があります:

オブジェクトのインスタンスを定義して作成する 関数を使用してオブジェクトを定義し、オブジェクトの新しいインスタンスを作成する

直接インスタンスを作成する

この例では、オブジェクトの新しいインスタンスを作成し、それに 4 つのプロパティを追加しました:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<script>
var person=new Object();
person.firstname="jack";
person.lastname="Doe";
person.age=35;
person.eyecolor="blue"; 
document.write(person.firstname + " is " + person.age + " years old.");
</script>
</body>
</html>

代替構文 (オブジェクト リテラルを使用):

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<script>
person={firstname:"John",lastname:"Doe",age:50,eyecolor:"blue"}
document.write(person.firstname + " is " + person.age + " years old.");
</script>
</body>
</html>

オブジェクト コンストラクターの使用 この例では、関数を使用してオブジェクトを構築します:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<script>
function person(firstname,lastname,age,eyecolor){
    this.firstname=firstname;
    this.lastname=lastname;
    this.age=age;
    this.eyecolor=eyecolor;
}
myFather=new person("jack","Doe",35,"blue");
document.write(myFather.firstname + " is " + myFather.age + " years old.");
</script>
</body>
</html>

JavaScript では、これは通常、実行している関数自体、または関数が属するオブジェクト (ランタイム) を指します

JavaScript オブジェクト インスタンスの作成

オブジェクト コンストラクターを取得したら、次のように新しいオブジェクト インスタンスを作成できます:

var myFather=new person("John","Doe",50," blue") ;
var myMother=new person("Sally","Rally",48,"green");

JavaScript オブジェクトにプロパティを追加します

オブジェクトに値を割り当てることで、既存のオブジェクトに新しいプロパティを追加できます:

personObj がすでに存在していると仮定すると、次の新しいプロパティを追加できます: 名、姓、年齢、目の色:

person.firstname="John";
person.age=30 ;
person.eyecolor="blue";
x=person.firstname;

T上記のコードが実行された後、オブジェクトの Functions の値。

コンストラクター関数内で定義されたオブジェクトのメソッド:

function person(firstname,lastname,age,eyecolor){
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor;
this.changeName=changeName;
function changeName(name){
this.lastname=name;
}
}

changeName() 関数名の値は、person の lastname プロパティに割り当てられます。

JavaScript クラス

JavaScript はオブジェクト指向言語ですが、JavaScript はクラスを使用しません。

JavaScript では、クラスは作成されず、(他のオブジェクト指向言語のように) クラスからオブジェクトが作成されることもありません。 JavaScript はクラスベースではなくプロトタイプベースです。

JavaScript for...in ループ

JavaScript for...in ステートメントは、オブジェクトのプロパティをループします。

構文

for (variable in object)
{
执行的代码……
}

注: for...in ループ内のコード ブロックは、属性ごとに 1 回実行されます。

学び続ける
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> </head> <body> <p>点击下面的按钮,循环遍历对象 "person" 的属性。</p> <button onclick="myFunction()">点击这里</button> <p id="demo"></p> <script> function myFunction(){ var x; var txt=""; var person={fname:"Bill",lname:"Gates",age:56}; for (x in person){ txt=txt + person[x]; } document.getElementById("demo").innerHTML=txt; } </script> </body> </html>