jsのObjectオブジェクトとは何ですか? jsでobjectオブジェクトを使う方法まとめ

不言
リリース: 2018-08-15 14:37:10
オリジナル
2912 人が閲覧しました

この記事では、js の Object オブジェクトとは何ですか? js でオブジェクトを使用する方法をまとめたものなので、困っている方は参考にしていただければ幸いです。

プロパティ記述子

JavaScript は、オブジェクトの値を記述し、プロパティが書き込み可能、​​構成可能、変更可能、列挙可能かどうかなど、その動作を制御する内部データ構造を提供します。この内部データ構造は「属性記述子」と呼ばれます。
各属性には独自の対応する属性記述子があり、属性のメタ情報が保存されます。

{
    value:'前端',
    writable:false,
    enumerable:true,
    configurable:false,
    get:undefined,
    set:undefined
}
ログイン後にコピー

現在オブジェクトに存在する属性記述子には、データ記述子とアクセス記述子の 2 つの主な形式があります。

データ記述子

データ記述子は値を持つ属性であり、書き込み可能でない場合もあります。データ記述子には、次のオプションのキー値があります:

  • value: この属性に対応する値は、任意の有効な JavaScript 値 (数値、オブジェクト、関数など) です。デフォルトは未定義です

  • writable: 属性の writable が true の場合、値は代入演算子によって変更できます。デフォルトは false です

  • configurable: 属性の configurable が true の場合、属性記述子を変更でき、対応するオブジェクトから属性を削除することもできます。デフォルトは false です

  • enumerable: Whenこの属性の enumerable が true である場合、この属性はオブジェクトの enumeration 属性に含めることができます。デフォルトは false です

アクセス記述子

アクセス記述子は、getter-setter 関数のペアによって記述される属性です。アクセス記述子には次のオプションのキー値があります:

  • get: プロパティのゲッター メソッドを提供します。ゲッターがない場合は未定義です。プロパティにアクセスすると、メソッドが実行されます。メソッドの実行時にパラメーターは渡されませんが、this オブジェクトが渡されます。

  • set: プロパティにセッターを提供するメソッド (存在する場合)。セッターではない場合、未定義になります。このメソッドは、プロパティ値が変更されるとトリガーされます。このメソッドは、プロパティの新しいパラメータ値である唯一のパラメータを受け入れます。

  • configurable: 属性の configurable が true の場合、属性記述子を変更でき、属性を対応するオブジェクトから削除することもできます。デフォルトは false です。

  • enumerable: 属性の This プロパティが表示される場合。 enumerable が true の場合のみ、オブジェクトの列挙されたプロパティ。デフォルトは false です。

プロパティ記述子を取得する

Object.getOwnPropertyDescriptor() メソッドは、指定されたオブジェクトの独自のプロパティに対応するプロパティ記述子を返します。

Object.getOwnPropertyDescriptor(obj,prop)
ログイン後にコピー
  • obj: 検索する対象のオブジェクト

  • prop: 対象のオブジェクト内の属性名(String型)

  • 戻り値: 指定された属性がオブジェクト上に存在する場合、その属性記述子を返すobject を返し、それ以外の場合は未定義を返します

var obj={}
obj.attr='前端';

console.log(Object.getOwnPropertyDescriptor(obj,'attr'));
ログイン後にコピー

プロパティ記述子を設定します

1。 Object.defineProperty() メソッドは、オブジェクトの新しいプロパティを定義するか、既存のプロパティを変更し、定義されるオブジェクト

Object.defineProperty(obj,prop,descriptor);
ログイン後にコピー
  • objを返します。プロパティのオブジェクト

  • prop: 定義または変更するプロパティの名前

  • descriptor: 関数に渡されるオブジェクト

  • 戻り値: 渡されるオブジェクト関数

2.Object に追加します。defineProperties() メソッドは、1 つ以上の新しいプロパティを定義するか、オブジェクトの既存のプロパティを変更し、オブジェクト

Object.defineProperties(obj,props)
ログイン後にコピー
  • obj: プロパティが定義されるオブジェクトを返します。

  • props: 定義する列挙可能属性または変更された属性記述子のオブジェクト

  • 戻り値: 関数に渡されるオブジェクト

属性記述子のオプションのキー値

1.value: 対象の属性に対応する値を示します。任意の有効な JavaScript 値 (数値、オブジェクト、関数など) を指定できます。デフォルトは undefine

var obj={};
obj.name='张三';

var attr=Object.getOwnPropertyDescriptor(obj,'name');
console.log(attr.value);

Object.defineProperty(obj,'name',{value:'李四'});
console.log(obj.name);
ログイン後にコピー

2.writable:Boolean 値で、ターゲット属性の値を変更できるかどうかを示します。属性の writable が true の場合、値は代入演算子によって変更できます。デフォルトは false

var obj={};
Object.defineProperty(obj,'attr',{
       value:'前端',
       writable:false
});
console.log(obj.attr);
obj.attr=100;
console.log(obj.attr);
ログイン後にコピー

3.configurable:Boolean 値で、ターゲット属性の記述子を変更できるかどうかを示します。属性の構成可能が true の場合、属性記述子を変更でき、対応するオブジェクトから属性を削除することもできます。デフォルトは false

var obj=Object.definePropety({},'attr',{
    value:'大前端',
    configurable:false
});

Object.definePropety(obj,'attr',{value:100});
Object.definePropety(obj,'attr',{writable:true});
Object.definePropety(obj,'attr',{enumerable:true});
Object.definePropety(obj,'attr',{configurable:true});
ログイン後にコピー

4.enumerable:Boolean 値で、ターゲット属性を横断できるかどうかを示します。プロパティの列挙可能値が true の場合、そのプロパティはオブジェクトの列挙プロパティに表示されます。デフォルトは false です。オブジェクトの属性の列挙可能な値が false の場合、次の 3 つの操作では属性を取得できません:

  • for...in ステートメント

  • Object.keys() メソッド

  • JSON .stringify() メソッド

var obj={};
Object.defineProperty(obj,'attr',{value:'前端',enumerable:false});
for(var key in obj){console.log(key);}
console.log(Object.keys(obj));
console.log(JSON.stringify(obj));
ログイン後にコピー
属性記述子のアクセサー

オブジェクトのプロパティは、直接定義するだけでなく、アクセサーを使用して定義することもできます。 setter は値保存関数であり、属性記述子で set を使用します。getter は値関数で、属性記述子で get を使用します

var obj=Object.defineProperty({},'attr',{
    get:function(){
        return '前端';
    },
    set:function(){
        console.log('setter:'+value);
    }
});

console.log(obj.attr);
obj.attr=100;
ログイン後にコピー
上記のアクセサー記述メソッドに加えて、JavaScript は次の記述メソッドも提供します。 :

var obj={
    get attr(){
        return '前端';
    },
    set attr(value){
        console.log('setter:'+value);
    }
}

console.log(obj.attr);
obj.attr=100;
ログイン後にコピー

防篡改

定义的对象默认在任何时候、任何位置,无论有意义的还是无意义的都可以修改对象的属性或方法。
而这些篡改可能会影响对象的内置属性或方法,从而导致对象的正常功能可能无法使用。
1.禁止扩展:禁止为对象扩展新的属性或方法

var obj={};
Object.preventExtensions(obj);
obj.attr='前端';
console.log(Object.isExtensible(obj));
console.log(obj.attr);
ログイン後にコピー

2.密封对象:禁止扩展新的属性或方法,禁止配置现有的属性或方法的描述符,仅允许读写属性的值

var sealed={};
Object.seal(sealed);
Object.isSealed(sealed);

Object.isExtensible(sealed);
ログイン後にコピー

3.冻结对象:禁止对对象执行任何修改操作

var frozen={1:81};
Object.isFrozen(frozen);
Object.freeze(frozen);
Object.isFrozen(frozen);

Object.isSealed(frozen);
Object.isExtensible(frozen);
ログイン後にコピー

相关推荐:

JS中Object对象的原型的使用方法

js如何打印object对象_javascript技巧

详解JavaScript中的Object对象 的示例代码

浅谈Javascript中Object与Function对象_javascript技巧

以上がjsのObjectオブジェクトとは何ですか? jsでobjectオブジェクトを使う方法まとめの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート