JavaScript型のオブジェクトの詳細説明 system_javascriptスキル-jsチュートリアル-php.cn

前の単語

JavaScript ではオブジェクトが重要です。JavaScript のほとんどすべてがオブジェクトであるか、オブジェクトのように機能します。オブジェクトを理解すれば、JavaScript も理解できます。 JavaScript では、参照型はデータと機能を一緒に編成するために使用されるデータ構造であり、クラスとも呼ばれます。参照型はオブジェクトのクラスのプロパティとメソッドを記述するため、オブジェクト定義と呼ばれることもあります

ほとんどの参照型値は Object 型のインスタンスです。さらに、Object は JavaScript で最も一般的に使用される型でもあります。オブジェクトインスタンスには多くの機能はありませんが、アプリケーションでのデータの保存と転送には非常に理想的です

オブジェクトの作成

オブジェクトタイプを作成するには 2 つの方法があります

[1]オブジェクトコンストラクター

var person = new Object();
//如果不给构造函数传递参数可以不加括号 var person = new Object;
person.name = 'bai';
person.age = 29; 
//创建无属性的空对象
var cody1 = new Object();
var cody2 = new Object(undefined);
var cody3 = new Object(null);
console.log(typeof cody1,typeof cody2, typeof cody3);//object object object 
//创建string、number、array、function、boolean、regex
console.log(new Object('foo'));
console.log(new Object(1));
console.log(new Object([]));
console.log(new Object(function(){}));
console.log(new Object(true));
console.log(new Object(/\bbt[a-z]+\b/));

ログイン後にコピー

[注意] Object() コンストラクター自体はオブジェクトであり、コンストラクターは Function コンストラクターを元に作成されたオブジェクトです

[2]オブジェクトリテラルを使用する

JavaScript には、ほとんどのネイティブオブジェクト値を作成するためのリテラルと呼ばれるショートカットが用意されています。リテラルを使用すると、new 演算子を使用した場合と同じ

が非表示になるだけです

基本的なプロセス

var person = {
name : 'bai',
age : 29,
5 : true
};

ログイン後にコピー

[注意] オブジェクトリテラルでカンマを使用して異なるプロパティを区切りますが、最後のプロパティの後にカンマを追加すると、IE7-

でエラーが発生します。

オブジェクトリテラルメソッドを使用してオブジェクトを定義すると、属性名が自動的に文字列に変換されます

//同上
var person = {
'name' : 'bai',
'age' : 29,
'5' : true
};

ログイン後にコピー

中括弧を空のままにすると、デフォルトのプロパティとメソッドのみを含むオブジェクトを定義できます

//等价于var person = new Object();
var person = {}; 
[tips]使用对象字面量封装多个可选参数
function displayInfo(args){
var output = '';
if(typeof args.name == 'string'){
output += 'name:' + args.name +'\n';
}
if(typeof args.age == 'number'){
output += 'Age:' + args.age + '\n';
}
console.log(output);
};
displayInfo({
name: 'Nicholas',
age: 29
});
displayInfo({
name: 'match'
});

ログイン後にコピー

上記のパラメーター受け渡しモードは、多数のオプションのパラメーターを関数に渡す必要がある状況に最適です。一般に、名前付きパラメータは扱いやすいですが、オプションのパラメータが複数ある場合は柔軟性に欠ける可能性があります。したがって、必須の値には仮パラメータを使用し、オブジェクトリテラルを使用して複数のオプションのパラメータをカプセル化します

オブジェクトの設定

オブジェクトのプロパティにアクセスするには 2 つの方法があります。ドット表記または括弧表記を使用して、オブジェクトのプロパティを取得、設定、または更新できます。

角括弧メソッドの 2 つの利点は、変数を通じて属性にアクセスできることと、属性名が Javascript の無効な識別子である可能性があることです

[注] 変数に漢字を含めることができます。漢字は文字に相当し、英語の文字と同じように扱われるため、person.white または person['白'] のように書くことができます。

var myObject = {
123:'zero',
class:'foo'
};
console.log(myObject['123'],myObject['class']);//'zero' 'foo'
console.log(myObject.123);//报错

ログイン後にコピー

角括弧内の値が非文字列型の場合は、String() を使用して暗黙的に文字列に変換されてから出力され、文字列型の場合は引用符がある場合は元の値が出力されます。そうでない場合は、変数として認識されます。変数が定義されていない場合は、エラーが報告されます。

person[0] = 1; //[]中的数字不会报错，而是自动转换成字符串
person[a] = 1; //[]中符合变量命名规则的元素会被当成变量，变量未被定义，而报错
person[''] = 2; //[]中的空字符串不会报错,是实际存在的且可以调用,但不会在控制台右侧的集合中显示
person[undefined 或 null 或 true 或 false] = 4;// 不会报错，而是自动转换成字符串
person['白'] = 6; // 不会报错

ログイン後にコピー

オブジェクトを削除

delete 演算子を使用すると、オブジェクトから属性を完全に削除できます。削除は、オブジェクトからプロパティを削除する唯一の方法です。プロパティを未定義または null に設定すると、オブジェクトからプロパティを削除せずにプロパティの値のみを変更できます。 delete はオブジェクトの下のデータのみを削除でき、他の 5 つの基本タイプの値は削除できません

[注] 削除しても、プロトタイプチェーンにあるプロパティは削除されません

var foo = {bar: 'bar'};
delete foo.bar;
console.log('bar' in foo);//false 
var a = 123;
delete a;
console.log(a);//123

ログイン後にコピー

変数 a をグローバル状態で宣言すると、window オブジェクトの下のデータ a と同等になります。 window.a または a と window の値を介して a に値を代入できます。 a と a は常に等しいですが、削除することはできません。

var a;
a = 10;
console.log(a,window.a);//10 10
window.a = 20;
console.log(a,window.a);//20 20
delete a ;
console.log(a,window.a);//20 20
delete window.a;
console.log(a,window.a);//20 20

ログイン後にコピー

window.b を使用して値を宣言して割り当てる場合 (b は window オブジェクトの下で宣言するのと同じです)、それを削除できます。削除後は delete b と delete window.b を使用しても同じ効果があります。 console.log(b) は変数が存在しないことを示すプロンプトを表示し、console.log(window.b) は未定義をプロンプトします

window.b = 10;
console.log(b,window.b);//10 10
delete b;
console.log(b);//报错
console.log(window.b);//undefined 
window.b = 10;
console.log(b,window.b);//10 10
delete window.b;
console.log(b);//报错
console.log(window.b);//undefined

ログイン後にコピー

オブジェクトのネスト

オブジェクトはネストできますが、値はレイヤーごとに取得する必要があります

var student = {
name : {
chinese : 1,
englisth : 2
},
sex : 1,
age : 26
}

ログイン後にコピー

[注意] 値は、student.name.chinese のようにレイヤーごとにのみ取得でき、name と同じレベルに chinese という要素も存在する可能性があるため、student.chinese を直接使用することはできません。 🎜>

实例方法

　　constructor:保存着用于创建当前对象的函数
　　hasOwnProperty(propertyName):用于检查给定的属性在当前对象实例中(而不是在实例的原型中)是否存在。其中，propertyName必须以字符串形式指定

　　isPrototypeOf(object):用于检查传入的对象是否是传入对象的原型

　　propertyIsEnumerable(propertyName):用于检查给定的属性是否能够使用for-in语句来枚举。其中，propertyName必须以字符串形式指定

　　toLocaleString():返回对象的字符串表示，该字符串与执行环境的地区对应

　　toString():返回对象的字符串表示

　　valueOf():返回对象的字符串、数值或布尔值表示，通常与toString()方法的返回值相同

var myObject = {
mark: true
};
console.log(myObject.constructor);//function Object(){}
console.log(myObject.hasOwnProperty('mark'));//true
console.log(Object.prototype.isPrototypeOf(myObject));//true
console.log(myObject.propertyIsEnumerable('mark'));//true
console.log(myObject.toLocaleString());//[object Object]
console.log(myObject.toString());//[object Object]
console.log(typeof myObject.valueOf(),myObject.valueOf());// object Object{mark:true}

ログイン後にコピー

小结：

Object类型

　　对象其实就是一组数据和功能的集合。对象可以通过执行new操作符后跟要创建的对象类型的名称来创建。而创建Object类型的实例并为其添加属性和（或）方法，就可以创建自定义对象。

var o = new Object();

ログイン後にコピー

　　Object的每个实例都具有下列属性和方法：

　　● constructor——保存着用于创建当前对象的函数
　　● hasOwnProperty(propertyName)——用于检查给定的属性在当前对象实例中（而不是在实例的原型中）是否存在。其中，作为参数的属性名(propertyName)必须以字符串形式指定（例如：o.hasOwnProperty("name")）
　　● isPrototypeOf(object)——用于检查传入的对象是否是另一个对象的原型
　　● propertyIsEnumerable(propertyName)——用于检查给定的属性是否能够使用for-in语句来枚举
　　● toString()——返回对象的字符串表示
　　● valueOf()——返回对象的字符串、数值或布尔值表示。通常与toString()方法的返回值相同。