javascript定义对象的方式

最新推荐文章于 2024-04-26 16:47:03 发布

fjclc2008

最新推荐文章于 2024-04-26 16:47:03 发布

阅读量418

点赞数

文章标签： javascript object function js引擎 aptana prototype

javascript 定义对象的方式,有6 种：
1.1在已有对象上添加属性

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>New Web Project</title>
    </head>
    <script type="text/javascript">
        //同过已有对象，扩充属性
        var object =new Object();
        object.name="zhangsan";
        object.sayName=function(name){
            this.name=name;
            alert(this.name);
        }
        object.sayName("lisi");

    </script>
</html>
1.2 工厂方式创建对象

<script type="text/javascript">
        //工厂方式创建对象
        function createObject(){
            var object = new Object();
            object.username = "hw";
            object.password = "810068";
            object.get = function(){
                alert(this.username + " , " + this.password);
            }
            return object;
        }

        var object1 = createObject();
        var object2 = createObject();
        object1.get();
    </script>

<script type="text/javascript">
        //工厂方式创建对象
        function createObject(name){
            var object = new Object();
            object.username = name;
            object.password = "81";
            object.get = function(){
                alert(this.username + " , " + this.password);
            }
            return object;
        }

        var object1 = createObject("黄威");
        var object2 = createObject("付攀");
        object1.get();

    </script>
如何让一个函数对象被多个对象所共享，而不是每一个对象拥有一个函数对象？
方法：把函数放在外面。请看下面的代码：

<script type="text/javascript">
        //使用工厂方法，创建对象
        /* 让一个函数对象被多个对象所共享，而不是每一个对象拥有一个函数对象：把方法放在外面*/
        function get(){
            alert(this.username + " , " + this.password);
        }

        function createObject(name, password){
            var object = new Object();
            object.username = name;
            object.password = password;
            object.get = get;
            return object;
        }

        var object1 = createObject("黄威", "456");
        var object2 = createObject("付攀", "123");
        object1.get();
    </script>

1.3 构造函数方式（使用构造方法）

<script type="text/javascript">
        function Person(){
            //在执行第一行代码前，js引擎会为我们生成一个对象
            this.username="hw";
            this.password="root";
            this.getInfo=function(){
                alert(this.username + " , " + this.password);
            }
            //此处有一个隐藏的return 语句，用于将之前生成的对象返回。
        }
        var person=new Person();
        person.getInfo();

    </script>

<script type="text/javascript">
        function Person(name, password){
            //在执行第一行代码前，js引擎会为我们生成一个对象
            this.username = name;
            this.password = password;
            this.getInfo = function(){
                alert(this.username + " , " + this.password);
            }
            //此处有一个隐藏的return 语句，用于将之前生成的对象返回。
        }

        var person = new Person("wei","444");
        person.getInfo();
    </script>

1.4 原型（prototype）方式

<script type="text/javascript">
        function Person(){

        }

        Person.prototype.username = "zhangsan";
        Person.prototype.password = "123";
        Person.prototype.getInfo = function(){
            alert(this.username + " , " + this.password);
        }
        var person1 = new Person();
        var person2 = new Person();
        person1.username = "黄";
        person1.getInfo();
        person2.getInfo();

    </script>
单纯使用原型方式定义的对象无法在构造函数中为属性赋初值，只能在对象生成之后再去改变属性值。
此方式的缺陷：多个对象之间共享属性。
1.5 原型+构造函数方式

<script type="text/javascript">
            function Person(){
                this.username=new Array();
                this.password="123";
            }
            Person.prototype.getInfo=function(){
                alert(this.username+" , "+this.password);
            }
            var p=new Person();
            var p2=new Person();
            p.username.push("黄威");
            p2.username.push("素洁");
            p.getInfo();
            p2.getInfo();
        </script>
1.6 动态原型方式
<script type="text/javascript">
         //C:\Documents and Settings\Administrator\My Documents\Aptana Studio Workspace\js00001\javascript002.html
/* 通过动态原型的方式*/
            function Person(){
                this.username = new Array();
                this.password = "123";
                if (typeof Person.flag == "undefined") {
                    alert("invoked");
                    Person.prototype.getInfo = function(){
                        alert(this.username + " , " + this.password);
                    }
Person.flag=true;
                }
            }

            var p = new Person();
            var p2 = new Person();
            p.username.push("黄威");
            p2.username.push("素洁");
            p.getInfo();
            p2.getInfo();
        </script>

以上就是js定义对象的6种方式。

fjclc2008

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
javascript定义对象的方式

javascript 定义对象的方式,有6 种：1.1在已有对象上添加属性 "http://www.w3.org/TR/html4/loose.dtd">http://www.w3.org/1999/xhtml"> New Web Project //同过已有对象，扩充属性
复制链接

扫一扫