JavaScript函数创建对象

JavaScript函数创建对象教程

在 JavaScript 中，我们可以通过自定义函数的方式来创建一个对象，也就是通过自定义一个函数，然后赋予它对象的思想。

通过函数创建对象，这个函数名首字母是需要大写的，且创建对象时，必须使用 new 操作符。

JavaScript函数创建对象

语法

function Obj(attr1, attr2, attr3, ...){
    this.attr1 = attr1;
    this.attr2 = attr2;
    this.attr3 = attr3;
    ...
    this.func = function(){
        //todo
    }
}

说明

我们通过一个自定义函数 Obj 的方式来创建对象。

优点

提高代码复用率，代码可以灵活调用，方便修改，自己传的参数是什么就是什么，既解决的重复实例化的问题又解决了对象识别的问题。

缺点

没有显式地创建对象，直接将属性和方法赋给了 this 对象，没有 return 语句。

案例

自定义函数创建对象

通过自定义函数方法创建对象

<!DOCTYPE html>
<html>
    <head>
        <title>JavaScript自定义函数创建对象</title>
        <script type="text/javascript">
            console.log("嗨客网(www.haicoder.net)");
            function Person(name, age, sex){
                this.name = name;
                this.age = age;
                this.sex = sex;
                this.sayHi = function(){
                    console.log("I am", this.name, "i am", this.age, "years old", "and my sex is", this.sex);
                }
            }
            var person = new Person("HaiCoder", 109, "F");
            person.sayHi();
            person.name = "haicoder";
            person.sayHi();
            person.score = 99;
            console.log("person name is:", person.name, "score is:", person.score);
        </script>
    </head>
</html>

程序运行后，控制台输出如下：

05_JavaScript自定义函数创建对象.png

我们首先创建了一个函数 Person，该函数接受三个参数，这三个参数就是对象的属性，同时函数里面还有一个函数，该函数就是对象的方法。

接着，我们就可以通过 new 的方式来通过函数来创建对象，我们创建了一个 person 对象，并且调用了 person 对象的 sayHi 方法。

同时，我们看到，通过自定义函数创建的对象，同样支持动态的添加属性。

JavaScript函数创建对象总结

在 JavaScript 中，我们可以通过自定义函数的方式来创建一个对象，也就是通过自定义一个函数，然后赋予它对象的思想。

通过函数创建对象，这个函数名首字母是需要大写的，且创建对象时，必须使用 new 操作符。