ホームページ > ウェブフロントエンド > jsチュートリアル > jsオブジェクトとは何ですか? js オブジェクトの概要 (コード付き)

jsオブジェクトとは何ですか? js オブジェクトの概要 (コード付き)

不言
リリース: 2018-08-14 09:55:40
オリジナル
3312 人が閲覧しました

この記事では、js オブジェクトとは何ですか? js オブジェクトの紹介 (コード付き) は、必要な友人が参考になれば幸いです。

オブジェクトとは

JavaScript では、オブジェクトは、個別のプロパティと型を持つエンティティのようなものです。カップはオブジェクトであり、カップには色や重さなどの属性があります。同様に、JavaScript オブジェクトには、その特性を定義するプロパティがあります。
メソッドはオブジェクトに関連付けられた関数です。言い換えれば、メソッドは値が関数であるオブジェクトのプロパティです。
オブジェクトは次のカテゴリに分類できます

  • 組み込みオブジェクト/ネイティブオブジェクト

はJavaScript言語によって事前定義されたオブジェクトです

  • ホストオブジェクト

はJavaScriptランタイム環境によって提供されるオブジェクトです

  • 定義されたオブジェクト

は、開発者が独自に作成したオブジェクトです

Objectオブジェクト

Object型は参照型です。しかし、オブジェクト型は JavaScript のすべての型の親です (すべての型のオブジェクトがオブジェクトのプロパティやメソッドになる可能性があります)

オブジェクトの作成

/*
* 1. 对象的初始化器创建方式
*     var 对象名={
*      属性名 : 属性值
*      方法名 : function{
*         方法体
*      }
*    }
*/
var obj = {
    name : '九筒',
    age : 2,
    sayYou : function () {
        console.log('火锅')
    }
};

/* 2. 对象的构造函数方式
*      * 利用所有的引用类型创建对应的对象->具有具体的类型
*        var num = new Number;//number类型
*        var str = new String;//string类型
*        var boo = new Boolean;//boolean类型
*      * 利用Object作为构造函数创建对象
*        var 对象名 = new Object();
*        var 对象名 = Object();
*/
var num = new Number();
var str = new Storage();
var boo = new Boolean();

var obj2 = new Object();
var obj3 = Object();

/*   利用Object.create创建对象
*      var 对象名 = Object.create(null) -> 创建一个空对象
      var 对象名 = Object.create(obj)
      * obj - 表示另一个对象
      * 特点 - 当前创建的新对象拥有与obj对象相同的属性和方法*/
var obj4 = Object.create(null);
var obj5 = Object.create(obj);
ログイン後にコピー

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

オブジェクトのプロパティの定義

オブジェクトのプロパティは添付された変数のようなものですオブジェクトに

/*对象介意定义多个属性
*  属性之间使用逗号分开*/
var obj = {
    name : '吴凡',
    age : 23,
    book : function () {
        console.log('暗毁')
    }
};
ログイン後にコピー

オブジェクトのプロパティを呼び出す

/*  调用对象的属性
*     对象名.属性名
*     不适用于复杂命名的属性名称*/
console.log(obj.name);

/*   对象名[属性名]-通用方式
     适用于复杂命名的属性名称
*     */
console.log(obj['name']);//属性名是字符串形式
ログイン後にコピー

オブジェクトのプロパティを追加、削除、変更する

var obj = {
    name : '火锅',
    variety : '比熊',
    age : function () {
        console.log('3')
    }
}
   /* 新增对象的属性
   *    1对象名.新的属性名 = 属性值
   *    2对象名[新的属性名] = 属性值*/
obj.col='白色';
console.log(obj.col);//白色

   /*删除对象的属性
   * delete 对象名.属性名
   * delete 对象名[属性名]*/
delete obj.col
console.log(obj.col);//undefined

  /*修改对象的属性
  * 对象名.已存在的属性名 = 属性值
  * 对象名[已存在的属性名] = 属性值*/
obj.name = '九筒';
console.log(obj.name);//九筒
ログイン後にコピー

オブジェクトのプロパティを検出する

var obj = {
    name : '火锅',
    variety : '比熊',
    age : function () {
        console.log('3')
    }
};
console.log(obj.name)

/*   1. 判断对象的属性值是否为undefined*/
if (obj.name !==undefined){
    console.log('obj对象name属性存在')
}else{
    console.log('obj对象name属性不存在')
}

/*   2. 判断对象的属性值,先转换为boolean类型*/
if (obj.name){
    console.log('obj对象name属性存在')
}

/*   3. 利用in关键字进行判断*/
if ('name' in obj){
    console.log('obj对象name属性存在')
}else{
    console.log('obj对象name属性不存在')
}

/*   4. Object类型提供了hasOwnProperty()方法*/
if (obj.hasOwnProperty('name')){
    console.log('obj对象name属性存在')
}else{
    console.log('obj对象name属性不存在')
}
ログイン後にコピー

便利な属性

var obj = {
    name : '小薄荷',
    age : '0.3',
    variety : function () {
        console.log('萨摩耶')
    }
};
// 1.for...in语句
for (var objAttr in obj) {
    // 通过对象属性或方法对应的值的类型进行区别
    if (obj[objAttr] instanceof Function) {
        // 当前是对象的方法
        obj[objAttr]();
    } else {
        // 当前是对象的属性
        console.log(obj[objAttr]);
    }
}

// 2.Object类型提供了keys()方法 - 只能遍历可枚举的属性
var arr = Object.keys(obj);
for (var v in arr) {
    var objAttr = arr[v];
    // 通过对象属性或方法对应的值的类型进行区别
    if (obj[objAttr] instanceof Function) {
        // 当前是对象的方法
        obj[objAttr]();
    } else {
        // 当前是对象的属性
        console.log(obj[objAttr]);
    }
}

// 3.Object类型提供了getOwnPropertyNames()方法 - 包括不可枚举的属性
var arr = Object.getOwnPropertyNames(obj);
for (var v in arr) {
    var objAttr = arr[v];
    // 通过对象属性或方法对应的值的类型进行区别
    if (obj[objAttr] instanceof Function) {
        // 当前是对象的方法
        obj[objAttr]();
    } else {
        // 当前是对象的属性
        console.log(obj[objAttr]);
    }
}
ログイン後にコピー

オブジェクトのメソッド

呼び出し、追加、変更と削除のメソッドオブジェクト

オブジェクトの呼び出し、追加、変更、削除のメソッドと属性は基本的に同じです

var obj = {
    name : '火锅',
    variety : '比熊',
    age : function () {
        console.log('3')
    }
}

/*调用对象的方法*/
// 1.对象名.方法名()
obj.sayMe();
// 2.对象名[方法名]()
obj['sayMe']();

/*新增对象的方法*/
// 1.对象名.新的方法名 = function(){}
obj.name = function(){
    console.log('九筒');
}
console.log(obj);
// 2.对象名[新的方法名] = function(){}

/*修改对象的方法*/
// 1.对象名.方法名 = function(){}
obj.name = function(){
    console.log('九筒');
}
// 2.对象名[方法名] = function(){}

/*删除对象的方法*/
//1.delete 对象名.方法名
delete obj.sayMe;
// 访问对象中不存在的方法 -> 报错(TypeError: obj.sayMe is not a function)
// obj.sayMe();
// 2.delete 对象名[方法名]
ログイン後にコピー

関連おすすめ:

jsの文字メソッドと文字列操作メソッドのまとめ(コード付き)

分析http プロキシ ライブラリの一般的な問題の例:nodejs の http-proxy

以上がjsオブジェクトとは何ですか? js オブジェクトの概要 (コード付き)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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