对象json

来源:互联网 发布:淘宝网金丝绒小傲女士 编辑:程序博客网 时间:2024/06/08 14:01

对象 obect

  • array
  • json
  • data
  • RegExp
  • null

json 它也可以放任何数据类型,具有代表性.

var json = {       key:value,       key:value,       key:value,       key:value//最后这个地方一定不可以加逗号   }

学习对象要学习

  1. 对象要怎么去创建?对象的写法.
  2. 理解对象的作用是干什么的(针对性,可以容纳不同的数据类型)
  3. 怎么去读取对象的属性和方法 以及 对 对象的属性和方法的增删改;
  4. 怎么样去判断对象的具体数据类型 检测内部的属性和方法是否存在.
  5. 对象的解析(for in).
  6. 对象在组件封装 开发过程中应用.

1.对象的写法.(开发过程推荐用引号包住key)

var xq = {    name : 'xq',    age : 18,    say:function(){        alert("同学们晚上好,好好听老师讲课");    },    marry:false,    tel:130000,    address:"湖南长沙"};var xq1 = {    "name" : 'xq',    "age" : 18,    'say':function(){        alert("同学们晚上好,好好听老师讲课");    },    marry:false,    tel:130000,    address:"湖南长沙"};
var person = {    name:'xiaoyuer',    age:16,    say:function(){        alert("我叫小鱼儿");    },    tel:11111,    address:"北京",    "e-mail":"12345@qq.com",    "valueOf":123//};//怎么样访问对象中的属性和方法//alert(person.name);//alert(person["name"]);//alert(person["e-mail"]) //这样只能[]//alert(person.say())//函数==>变量的话//var say = "say";//alert(person[say]);//修改//person.name = "goudan";//// person.marry = true;// alert(person["marry"]);//怎么样删除对象(arr,json) 唯一的一个方法 arr = null; json = null;//怎么样删除对象里边的属性?delete person.name;//alert(person.name);//undefined//怎么样去检测 json里边还有没有属性或者方法  通过 in返回一个布尔值 (字符串 in 对象)//alert("name" in person);//true//alert("address" in person);//in不光检测你自己的 还会检测你从父类继承的 但是无法判断 到底是自己还是父类的//对象都会继承js内置方法 valueOf toString constructor hasOwnProperty....//alert("valueOf" in person);true//alert(person["valueOf"])//123//检测到底是不是自己的 避开父类 hasOwnProperty()//alert(person.hasOwnProperty("name"));//true//alert(person.hasOwnProperty("toString"));//false//alert(person.hasOwnProperty("name")); //false===>上面delete

只有对象才可以点 (.) 方法和属性

//多个参数需要你返回的时候 要么返回一个数组 要么返回一个对象 数组 排序 反转/ 对象去点// function fn(){//     var a = 1;//     function fn1(){//     };//     var json = {//         a:a//     };//     return json;//返回对象// }// alert(fn().a);//函数也可以.window{    "document":document{                "getElementById":getElementById,                "getElementsByClassName":getElementsByClassName,                "obj":obj{                    "style":style{                            "width":width,                            "height":height                    }                    "title":title                }    }}

输出json内容

var person = {    "name":"狗蛋",    "marry":false,    "say":function(){alert("goudan")}};alert(person);//objectvar arr = [1,23,4];alert(arr);//1,23,4//对象字符化     JSON.stringify()  //JSON 不允许包含函数,JSON.stringify() 会删除 JavaScript 对象的函数.//可以在执行 JSON.stringify() 函数前将函数转换为字符串来避免以上问题的发生//person.say = person.say.toString();//var jsonStr = JSON.stringify(person);//alert(jsonStr);//输出字符串'{"name":"狗蛋","marry":false,"say":"function(){alert('goudan')}"}'//字符对象化 JSON.parse()//var person2 = '{"name":"xq", "age":18}';//里面必须是双引号//var person3 = "{'name':'xq', 'age':18}";//报错//alert(person2.name);  //undefined//var obj = JSON.parse(person2);//alert(obj.name); //xq//alert(typeof obj); //object

对象的运用

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <meta name="Author" content=" ">    <title>Document</title>    <style type="text/css">        *{margin: 0;padding: 0;}        a{text-decoration: none;}        ul,li{list-style: none;}        body{font-size: 14px;font-family: "微软雅黑";}        table{width: 600px;border-collapse: collapse;margin: 20px auto;}        table td{border: 1px solid #333;padding: 10px;width:125px;}    </style></head><body>    <table>        <thead>            <tr>                <td>姓名</td>                <td>年龄</td>                <td>地址</td>                <td>操作</td>            </tr>        </thead>        <tbody id="tbody">        </tbody>    </table>    <script type="text/javascript">        var html = "";        var tbody = document.getElementById("tbody");        //需求 是要把人的数据放到表格里边  数组 是不行的        //对象具有代表性        var xiaoyuer = {            name:"xiaoyuer",            age:18,            address:"北京"        };        // tbody.innerHTML += "<tr>"+        // "    <td>"+xiaoyuer.name+"</td>"+        // "    <td>"+xiaoyuer.age+"</td>"+        // "    <td>"+xiaoyuer.address+"</td>"+        // "    <td>操作</td>"+        // "</tr>";        var Arkin = {            name:"Arkin",            age:20,            address:"杭州"        };        // tbody.innerHTML += "<tr>"+        // "    <td>"+Arkin.name+"</td>"+        // "    <td>"+Arkin.age+"</td>"+        // "    <td>"+Arkin.address+"</td>"+        // "    <td>操作</td>"+        // "</tr>";        var xq = {            name:"xq",            age:20,            address:"湖南长沙"        };        // tbody.innerHTML += "<tr>"+        // "    <td>"+xq.name+"</td>"+        // "    <td>"+xq.age+"</td>"+        // "    <td>"+xq.address+"</td>"+        // "    <td>操作</td>"+        // "</tr>";        var arr = [];        arr.push(xq);        arr.push(Arkin);        arr.push(xiaoyuer);        arr.sort(function(a,b){            var age1 = a.age;            var age2 = b.age;            return age1 - age2;        });        // 只有对象才能点        for(var i=0;i<arr.length;i++){            var data =arr[i];            tbody.innerHTML += "<tr>"+            "    <td>"+data.name+"</td>"+            "    <td>"+data.age+"</td>"+            "    <td>"+data.address+"</td>"+            "    <td>操作</td>"+            "</tr>";        };        // 数组才能统一操作,sort reverse        //'小鱼儿' --- 'xiaoyuer'汉字==>拼音 (插件)    </script></body></html>
0 0
原创粉丝点击