您的位置:首页 > Web前端 > JavaScript

javascript之工厂方式定义对象

2013-12-15 17:02 507 查看
1,每一个函数对象都有一个length属性,表示该函数期望接收的函数格式,它与函数的arguments不同,arguments.length表示函数实际接收的函数格式。

    <script type="text/javascript">

        var add = function(num, num2, num3) {

            alert(num + num2 + num3);

        };

        alert(add.length);

        //add是指向函数的引用

        add(1, 2, 3);

        var add2 = function() {

            

        };

        alert(add2.length);

    </script>

会弹出3,6,0

2,javaScript中有五种原始数据类型:Undefined,Null,Boolean,Number,String。

    Undefined :

    Undefined数据类型的值只有一个:undefined.

        <script type="text/javascript">

            var s;

            alert(s);

            

        </script>

    Null

    Null数据类型的值只有一个:null

    Boolean数据类型的值有两个:true和false

    String

    <script type="text/javascript">

/**        var s = "hello";

        var a = 'hello';

        alert(s);

        alert(typeof s); //String

        alert(a); **/

/**        var s = new String("hello");

        alert(typeof s); //object s是对象类型 **/

        var s = false;

        alert(typeof s);

    </script>

    Number :

        var s = 3;

        alert(typeof s);

3,在javaScript中没有char数据类型。

4,在EditPlus里边用快捷键ctrl + b 是默认在IE中浏览网页

5,typeof是一元运算符,后跟变量的名称,用于获取变量的数据类型,其返回值有5个:undefined,boolean,number,String,以及object

6,在javaScript中,如果函数没有声明返回值,那么会返回undefined

    <script type="text/javascript">

        function add() {

            return 3;

        }

        alert(add());

    </script>

    结果:3

    <script type="text/javascript">

        function add() {

            

        }

        alert(add());

    </script>

    结果 :undefined

    <script type="text/javascript">

        function add() {

            return;    

        }

        alert(add());

    </script>

    结果 :undefined

7,nnll与undefined的关系:undefined实际上是从null派生出来的

    <script type="text/javascript">

        alert(typeof s)

    </script>

    结果:undefined

    <script type="text/javascript">

        alert(undefined == null)

    </script>

    结果:true

8,强制类型装换:在javaScript中有3中强制类型装换:Boolean(value),Number(value),String(value).

    <script type="text/javascript">

        var s = Number(3);

        alert(s),

    </script>

    结果:3    

    <script type="text/javascript">

        var s = Boolean(true);

        alert(s);

    </script>

    结果:true

    <script type="text/javascript">

        var s = Boolean("hello");

        alert(s);

    </script>

    结果:true

    <script type="text/javascript">

        var s =    String("hello");

        alert(s);

    </script>

    结果:hello

    <script type="text/javascript">

        var s =    String("hello");

        alert(typeof s);

    </script>

    结果:string

    <script type="text/javascript">

        var s =    new String("hello");

        alert(typeof s);

    </script>

    结果:object

    <script type="text/javascript">

        var s =    new Boolean(true);

        alert(typeof s);

    </script>

    结果:object

    <script type="text/javascript">

        var s =    new Boolean("hello");

        alert(typeof s);

    </script>

    结果:object

    <script type="text/javascript">

        var s =    new Boolean("hello");

        alert(s);

    </script>

    结果:true

9,在javaScript中对于函数中定义的变量来说,加var表示局部变量,不加var表示全局变量

10,在javaScript中,所有对象都是从Object对象继承过来的。Object中的属性是不可枚举的(propertyIsEnumerable 返回false),因此无法通过for...in语句得到其中的属性

    <script type="text/javascript">

        var object = new Object()

        for (var v in object) {

            alert(v);

        } //这样得不到Object中的属性的

        alert(object.propertyIsEnumerable("prototype"););

        结果:false

    </script>

    <script type="text/javascript">

        for (var v in window ) {

            alert(v);

        }

    </script>//可以得到window中的属性

11,

    <script type="text/javascript">

        var object = new Object();

        alert(object.username);

        object.username = "shengsiyuan";

        alert(object.username);

        object["user"] = "shengsiyuan";

        alert(object.user);

    </script>

    结果:undefined,shengsiyuan,shengsiyuan

    <script type="text/javascript">

        var object = new Object();

        //alert(object.username);

        //object.username = "shengsiyuan";

        //alert(object.username);

        object["user"] = "shengsiyuan";

        alert(object.user);

        delete object.user; //user属性已经从object对象中删除

        alert(object.user);

    </script>

    结果:shengsiyuan, undefined

12,在javaScript中,可以动态添加对象的属性,也可以动态删除对象的属性。

13,在javaScript中定义对象的最常见的方式

    <script type="text/javascript">

        var object = {username:"zhangsan",password:"123"}

        alert(object.username);

        alert(object.password);

    </script>

    结果:zhangsan, 123

    <script type="text/javascript">

        var object = {username:"zhangsan",password:123}

        alert(object.username);

        alert(object.password);

    </script>

    结果:zhangsan, 123

14,在javaScript中定义数组的方式

 (1)

    <script type="text/javascript">

        var array = new Array();

        array.push(1);

        array.push(2);

        array.push(3);

        alert(array.length);

    </script>

    结果:3

 (2)

    <script type="text/javascript">

        var array = [1,2,3];

        alert(array.length);

    </script>

    结果:3

    <script type="text/javascript">

        var array = [1,3,25];

        //alert(array.length);

        array.sort();

        alert(array);

    </script>

    结果:1,25,3

    //把数组中的对象先转换成字符串,让后进行比较

15,对于javaScript数组的shot方法来说,它会先将待排序的内容转换为字符串(调用toString()方法),按照字符串的先后顺序进行排序

    <script type="text/javascript">

        function compare(num1,num2) {

            var temp1 = parseInt(num1);

            var temp2 = parseInt(num2);

            if (temp1 < temp2) {

                return -1;

            } else if (temp1 == temp2) {

                return 0;

            } else {

                return 1;

            }

        }

        var array = [1,3,25];

        array.sort(compare); //函数名是对象引用

        alert(array);

    </script>

    <script type="text/javascript">

        var array = [1,3,25];

        //匿名函数

        array.sort(function(num1,num2) {

            var temp1 = parseInt(num1);

            var temp2 = parseInt(num2);

            if (temp1 < temp2) {

                return -1;

            } else if (temp1 == temp2) {

                return 0;

            } else {

                return 1;

            }

        });

        alert(array);

    </script>

16,javaScript中定义对象的几种方式(javaScript中没有类的概念,只有对象):

 (1)基于已有对象扩充其属性和方法:

  //适合使用一次

     <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>

 (2)工厂方式

    不带参数的构造方法

     <script type="text/javascript">

        //工厂方式创建对象

        function createObject() {

            var object = new Object();

            object.username = "zhangsan";

            object.password = "123";

            object.getValue = function() {

                alert(this.username + "," + this.password);

            }

            return object;

        }

        var object1 = new createObject();

        var object2 = new createObject();

        object1.getValue();

    </script>

    带参数的构造方法

    <script type="text/javascript">

        function createObject(username, password) {

            var object = new Object();

            object.username = username;

            object.password = password;

            object.getValue = function() {

                alert(this.username + "," + this.password);

            }

            return object;

        }

        var object1 = new createObject("zhangsan", "123");

        object1.getValue();

    </script>

    //改进

    //让一个函数对象被多个对象所共享,而不是每一个对象拥有一个函数对象

    <script type="text/javascript">

        //改进

        function getValue() {

                alert(this.username + "," + this.password);

        }

        function createObject(username, password) {

            var object = new Object();

            object.username = username;

            object.password = password;

            object.getValue = getValue;

            return object;

        }

        var object1 = new createObject("zhangsan", "123");

        var object2 = new createObject("lisi","456");

        object1.getValue();

        object2.getValue();

    </script>

(3)构造函数方式

    <script type="text/javascript">

        //构造函数方式

        function Person() {

            //在执行第一行代码前,js引擎会为我们生成一个对象

            this.username = "zhangsan";

            this.password = "123";

            this.getInfo = function() {

                alert(this.username + "," + this.password);

            }

            //此处有一个隐藏的return语句,用于将之前生成的对象返回

        }

        var person = new Person();

        person.getInfo();

    </script>

    //可以在构造对象时传递参数。带参数

    <script type="text/javascript">

        //构造函数方式

        function Person(username,password) {

            //在执行第一行代码前,js引擎会为我们生成一个对象

            this.username = username;

            this.password = password;

            this.getInfo = function() {

                alert(this.username + "," + this.password);

            }

            //此处有一个隐藏的return语句,用于将之前生成的对象返回

        }

        var person = new Person("zhangsan", "123");

        person.getInfo();

    </script>

 (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 person = new Person();

        var person2 = new Person();

        person.username = "lisi";

        person.getInfo();

        person2.getInfo();

    </script>

    结果:lisi,123    zhangsan,123

    单纯使用原型方式定义类无法在构造函数中为属性赋初值,只能在对象生成后再去改变属性值。

    <script type="text/javascript">

        function Person() {

            

        }

        Person.prototype.username = new Array();

        Person.prototype.password = "123";

        Person.prototype.getInfo = function() {

            alert(this.username + "," + this.password);

        }

        var person = new Person();

        var person2 = new Person();

        person.username.push("zhangsan");

        person.username.push("lisi");

        person.password = "456";

        person.getInfo();

        person2.getInfo();

    </script>

    结果:zhangsan,lisi,456    zhangsan,lisi,123

    如果使用原型方式定义对象,那么生成的所有对象会共享原型中的属性,这样一个对象改变了该属性也会反应到其他对象当中。

    

    使用原型 + 构造函数方式来定义对象,对象之间的属性互不干扰,各个对象间共享同一个方法。

    <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("zhangsan");

        p2.username.push("lisi");

        

        p.getInfo();

        p2.getInfo();

    </script>

 (5) 动态原型方式: 在构造函数中通过标识量让所有对象共享一个方法,而每个对象拥有自己的属性

    <script type="text/javascript">

        function Person() {

            this.username = "zhangsan";

            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.getInfo();

        p2.getInfo();
    </script>

//为Array扩展一个sayHello方法,每次new出来一个Array时,都会有sayHello()这个方法

Array.prototype.sayHello = function() {

alert("sayHello");

}

var array = new Array();

array.sayHello();
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  javascript