如何使用JavaScript對象字面量和構造函數

這篇文章主要為大家展示了如何使用JavaScript對象字面量和構造函數，內容簡而易懂，希望大家可以學習一下，學習完之后肯定會有收獲的，下面讓小編帶大家一起來看看吧。

對象中只有兩種屬性:（一種比較細的分法）

屬性(數據屬性)比如：名字，年齡，性別，出版社，地址等信息；
方法(封裝代碼的屬性：函數 ，在這也是一種屬性)。

在JS中對象的字面量和構造函數是非常的重點，其實在其他的語言中，是沒有對象字面量的。

一.對象的字面量的語法:

{
屬性名: 屬性值,
屬性名: 屬性值,
方法名: 你們函數
}

這個大括號括起來的整個代碼塊就是叫做對象。

var p1 = { }

①訪問對象的屬性:

  1. . 語法

        對象.屬性

  2. [ ] 語法

    對象["屬性名"]

    對象[變量]     通過外面var一個變量，這個變量類型是字符串，然后在[]中直接使用變量名。

②修改屬性的值:（當這個屬性名在對象字面量中是存在的，那就是修改其值）
②修改屬性的值:（當這個屬性名在對象字面量中是存在的，那就是修改其值）
③新增屬性的值:（當這個屬性名在對象字面量中是沒有的，那就是新增其屬性名和屬性值）

修改和新增都是一下語法：

對象.屬性名 = 值

④刪除對象的屬性:

delete 對象.屬性

二.使用構造函數來創建對象:

  function Person(name, sex){
    var a = 10;
    this.name = name;
    this.sex = sex;
    this.speak = function(){

          }
    }

現在我們new一下：

var p1 = new Person ;

那么我們就叫p1是一個對象，一new出來就會在堆內存中分配一塊內存空間。

那么p1的類型就是Person.

那么如果我們用 p1 instanceof Person 檢測會返回true，那么 instanceof 就是測試對象類型。

在代碼塊中，var a = 10 ; 這個語句是一個變量，變量是放在 棧內存 ，但當他執行完一遍這個構造函數時，這個a就消失了，也就是說這個局部變量的生命周期是new出來到執行完構造函數最后一句的就消失了。

但是 里面的屬性，name sex speak 這些屬性上只要p1在他們就在。

那么現在我們再次體會一下局部變量a的生命周期和內存模型中的理解：

<script>
  function Person(name, sex) {
    var a = 10;
    this.name = name;
    this.sex = sex;
    this.outputa = function () {
      console.log(a);
    }
    this.speak = function () {

    }
  }

  var p1 = new Person();
  console.log(p1.a);
  p1.outputa();
</script>

結果是：

首先，var p1 = new Person();，new一下出來一個p1對象，計算機就會在堆內存（heap memory）中為P1選中一塊內存。

然后，console.log(p1.a);，這句語句執行，這句可以這么理解①：你a在全局變量中并沒有，只在構造函數中的局部變量中才有，在構造函數中的局部變量var a = 10;他會聲明提前，但是他只是提前到函數的第一行執行。這也就可以說明局部變量，我們不能在外部使用。理解②就是函數作用域中的變量他是局部變量，在棧內存分配內存后，當函數執行到最后一行時，他就結束生命周期。

這個undefined是JS的一種安全機制，如果對象點一個沒有生命的變量，那么就會默認成undefined，但如果是普通的變量，就會報錯。報錯信息是這個變量未被定義。

詳見：JavaScript內存模型詳解。

*注意：對象字面量的用法用 ： 和 ，

​ 構造函數的用法用 = 和 ；

那么類型和對象之間的關系是什么呢？

也就是比如p1和Person的關系是什么呢？見下表：

以上就是關于如何使用JavaScript對象字面量和構造函數的內容，如果你們有學習到知識或者技能，可以把它分享出去讓更多的人看到。