js物件是什麼？ js物件的介紹（附程式碼）

這篇文章帶給大家的內容是關於js物件是什麼？ js物件的介紹（附程式碼） ，有一定的參考價值，有需要的朋友可以參考一下，希望對你有幫助。

物件是什麼

在JavaScript中，一個物件就像一個單獨擁有屬性和類型的實體。一個杯子作為一個對象，杯子有顏色、重量等屬性。同樣，JavaScript物件也有屬性定義它的特徵。
方法是關聯到某個物件的函數，或者說，一個方法是一個值為某個函數的物件屬性。
物件可以分為以下幾類

• 內建物件/原生物件

#就是JavaScript語言預先定義的物件

• 宿主物件

是JavaScript執行環境提供的物件

• 自訂物件

就是開發人員自主建立的物件

Object物件

Object類型是參考類型。但Object類型是所有JavaScript中所有類型的父級（所有類型的物件都可以是Object的屬性和方法）

#建立物件

/*
* 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中字元方法以及字串操作方法的總結（附程式碼)

nodejs中http代理程式庫http-proxy中常見的問題分析

以上是js物件是什麼？ js物件的介紹（附程式碼）的詳細內容。更多資訊請關注PHP中文網其他相關文章！