代码改变世界

JS之Object、Array

2011-10-22 20:31  三皮开发时  阅读(316)  评论(0编辑  收藏  举报
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=GBK">
        <title>Untitled Document</title>
        
        <script type="text/javascript">
            
            //Object
            function objectFunction(){
                var person = new Object();
                
                //对象类型第一种赋值方法
                person.name = "Nicholas";                
                person.age = 29;
                
                //对象类型第二种赋值方法
                var personOther = {
                    "name" : "SP",
                    "age"  : 29
                };
                
                //可以使用变量来访问属性 eg: var propertyName = "name" personOther[propertyName]
                var testName = personOther["name"];
                //通常,除非必须使用变量来访问属性,否则我们建议使用点表示法
                var testAge = personOther.age;
                alert(testName);
                alert(testAge);
                
                //可以通过typeof操作符来检测每个属性是否存在
                if(typeof personOther.name == "string"){
                    alert('Name is string');
                }
                
                if(typeof personOther.age == "number"){
                    alert('Age is number');
                }
                
                if(typeof personOther == "object"){
                    alert('personOther is object');
                }
            }
            
            //Array
            function arrayFunction(){
                //几种申明方式
                var colorss = new Array(3);//创建一个包含3项的数组
                var color = Array("Greg");//创建一个包含1项,即字符串"Greg"的数组,可以省去new
                var colo = ["red","blue""green"];//创建一个包含3项的数组
                
                var colors = ["red","blue","green"];
                alert('长度:'+colors.length);//3
                alert('colors:第一项:'+colors[0]);//显示第一项
                
                alert('colors:第三项:'+colors[2]);
                colors[2] = "black"//修改第三项
                
                alert('colors:第三项:'+colors[2]);
                colors[3] = "brown"//新增第四项
                
                alert('colors:第四项:'+colors[3]);
                //数组有个toString()、toLocaleString() 当数组使用他们的时候结果是将数组项连接起来
                alert(colors.toString());//red,blue,green,black
                alert(colors.valueOf());//red,blue,green,black
                alert(colors);//red,blue,green,black
                
                
//默认的是以","号隔开,可以使用join()方法改变
                alert(colors.join("||"));//red||blue||green||black
            }
            
            //测试toString、toLocaleString
            function toStringORtoLocaleString(){
                var person1 = {
                    toLocaleString : function(){
                        return "Person1Red";
                    },
                    toString : function(){
                        return "Persion1Blue";                        
                    }
                };
                var person2 = {
                    toLocaleString : function(){
                        return "Person2Red";
                    },
                    toString: function(){
                        return "Person2Blue";
                    }
                };
                
                var person = [person1,person2];
                alert(person); //Persion1Blue,Person2Blue
                alert(person.toString());//Persion1Blue,Person2Blue
                alert(person.toLocaleString());//Person1Red,Person2Red
            }
            
            //数组排序
            function sortFunction(){
                var values = [1,2,7,4,5];
                alert(values.sort()); //升序 1,2,4,5,7
                alert(values.reverse().join("->"));//反转降序 7->5->4->2->1
            }
            
        </script>
    </head>
    <body>
        <input type="button" value="Object"  onclick="objectFunction()">
        <br/>
        <input type="button" value="Array" onclick="arrayFunction()">
        <br>
        <input type="button" value="objectArray" onclick="toStringORtoLocaleString()">
        <br>
        <input type="button" value="数组排序" onclick="sortFunction()">
    </body>
</html>