JavaScript對象的幾種創建方式與優缺點


JavaScript中常見的幾種創建對象的方式有:Object構造函數模式、對象字面量模式、工廠模式、自定義構造函數模式、構造函數加原型組合模式;他們各自有各自的優缺點和使用場景。

1. Object構造函數模式

  • 使用場景:起始時不確定對象內部數據。
  • 缺點:語句太多
     var p = new Object()
        p.name = 'tom'
        p.age = 12
        p.steName = function (name) {
            this.name = name
        }

2. 對象字面量模式

  • 適用場景:起始時對象數據確定。
  • 缺點:如果創建多個對象、有重復代碼。
var p = {
            name: 'jack',
            age: 13,
            setName: function (name) {
                this.name = name
            }
        }

3. 工廠模式

  • 適用場景:需要創建多個對象。
  • 缺點: 對象沒有一個具體的類型、都是Object類型。
function createPerson (name,age) { //返回一個對象的函數就是工廠函數
            var obj = {
                name: name,
                age: age,
                sstName: function (name) {
                    this.name = name
                }
            }
            return obj
        }

4. 自定義構造函數模式

  • 使用場景: 需要創建多個類型確定的對象。
  • 缺點: 每個對象都有相同的數據(方法),浪費內存。
function Person (name,age) {
            this.name = name
            this.age = age
            this.setName = function (name) {
                this.name = name
            }
        }
        var p1 = new Person('tom',15)
        var p2 = new Person('jack',14)
        console.log(p1 instanceof Person) //true p1是Person類型

        function student (name,grade) {
            this.name = name
            this.grade = grade
        }  

        var s1 = new student('peter',6)
        console.log(s1 instanceof student) //true s1是student類型

        console.log(p1,p2)

Markdown

p1和p2有各自都有相同的setName()方法,造成內存浪費。

5. 構造函數+原型模式

  • 使用場景: 要創建多個類型確定的對象
function Person (name,age) {
           this.name  = name
           this.age = age
       }
       Person.prototype.setName = function (name) {
           this.name = name
       }

       var p1 = new Person('tom',12)
       var p2 = new Person('jack',13)

       console.log(p1,p2)

Markdown

對象的方法被放到了原型上面避免了內存浪費。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM