JavaScript基础 json 实例

JSON 是用于存储和传输数据的格式。
JSON 通常用于服务端向网页传递数据 。

姓名:
网址:
网站 slogan:

"name":"阿里", 用来交互时,在其他语言里,对象的属性必须加双引号;
属性名 属性值
最后一个属性完一定不要加 , 不然一些浏览器解析出来会出错;

JSON 解析器和 JSON 库支持许多不同的编程语言。 目前非常多的动态(PHP,JSP,.NET)编程语言都支持JSON。

var obj = {
        name : '阿里',
        age  : '18',
        job  : '前端工程师',
        sex  : '1'   //注意:不要加 , 不然一些浏览器解析出来会出错
}

也可以用一个变量来代替值

var a = “178cm”  //如果要交互 这里""一定要写
var obj = {
        name : '阿里',
        age  : '18',
        job  : '前端工程师',
        sex  : '1',
        height : a       //如果要跟后台交互 前端会先把a的值调用过来再传输
}

注意:{}里的属性名不能用 变量名 来操作
var b = "name";
var obj = {
        b : '阿里', //这里不能这样操作,{}里对象属性没有一个能代替
        age  : 18, //这里可以直接写数字,这种写法在js是允许的
        job  : '前端工程师', //这里一定要"", man 也要加" "不然就变成变量了
        sex  : '1',
        height : a       
}

如果一定要用b来代替
obj[b] = "阿里";

取值

var obj = {
        name : '阿里',
        age  : '18',
        job  : '前端工程师',
        sex  : '1',   
        0 : "我是数字属性名" //可以用数量来做属性名
}
如果要取name属性
console.log( obj.name );
打印出 阿里
console.log( obj.0 ); 会报错  obj.0会读成 . 小数 所以会报错  要用[]
console.lgo( obj["0"] ); 注意

如果出现2个name

var obj = {
        name : '阿里',
        age  : '18',
        job  : '前端工程师',
        sex  : '1',   
        0 : "我是数字属性名" ,   //可以用数量来做属性名
        name : '阿飞'
}
上面会name会被下面的覆盖掉

修改值

obj.name = '阿狗';
console.log( obj );
JavaScript基础 json 实例_第1张图片
image.png

增加 键/值 对

obj.width = ' 885';
obj.8 = 666 //这里会报错
obj["8"] = 666
JavaScript基础 json 实例_第2张图片
image.png

删除

delete obj["8"];
delete obj["0"];
JavaScript基础 json 实例_第3张图片
0属性就没了

全部要删除

obj = {};
把里面的属性全部置空

第二种方法

 for(var x in obj){
            delete obj[x];
        }
 console.log( obj );
image.png

注意:对象是没有长度

JSON.parse()将对象类型的字符串转化成对象

var str = '{  "age":20, "name":"小兔子" }';
var obj = {};
现在要拿到age的值
console.log(str.age)  ===>打印出 undefined  现在是str对象下age属性
        obj = JSON.parse( str ); ===>变成对象
        console.log( obj.age ); ===>读取到20

JSON.stringify()将对象转化成字符串

将上面的obj转化成字符串
        str2 = JSON.stringify( obj );
        console.log( str2 );  ==>{"age":20,"name":"小兔子"}
image.png

你可能感兴趣的