常见的数据流行交互格式有YAML、XML、和JSON都是常用的数据交互格式。

字面量
引用Mozilla Developer Center里的几句话，供大家参考：

1. 他们是固定的值，不是变量，让你从“字面上”理解脚本。 (Literals)
2. 字符串字面量是由双引号（"）或单引号（'）包围起来的零个或多个字符组成的。(Strings Literals)
3. 对象字面量是由大括号（{}）括起来的零个或多个对象的属性名-值对。(Object Literals)

什么时候会成为JSON

JSON是设计成描述数据交换格式的，他也有自己的语法，这个语法是java script的一个子集。
{ "prop": "val" } 这样的声明有可能是java script对象字面量也有可能是JSON字符串，取决于什么上下文使用它，如果是用在string上下文（用单引号或双引号引住，或者从text文件读取）的话，那它就是JSON字符串，如果是用在对象字面量上下文中，那它就是对象字面量。

例如：

// 这是JSON字符串
var foo = '{ "prop": "val" }';

// 这是对象字面量
var bar = { "prop": "val" };

而且要注意，JSON有非常严格的语法，在string上下文里{ "prop": "val" } 是个合法的JSON，但{ prop: "val" }和{ 'prop': 'val' }确实不合法的。所有属性名称和它的值都必须用双引号引住，不能使用单引号。

JS当中的JSON对象

目前，JSON对象已经成为了JS当中的一个内置对象，有两个静态的方法：JSON.parse和JSON.stringify。

JSON.parse主要要来将JSON字符串反序列化成对象，JSON.stringify用来将对象序列化成JSON字符串。老版本的浏览器不支持这个对象，但你可以通过json2.js来实现同样的功能。

例如:

// 这是JSON字符串，比如从AJAX获取字符串信息
var my_json_string = '{ "prop": "val" }';

// 将字符串反序列化成对象
var my_obj = JSON.parse( my_json_string );

alert( my_obj.prop == 'val' ); //  提示 true, 和想象的一样!

// 将对象序列化成JSON字符串
var my_other_json_string = JSON.stringify( my_obj );

对象的创建

java script中对象的创建有很多种方式，如下：

1. 第一种方式是通过构造函数的形式创建成一个对象

2. 第二种形式是通过{}这种写法直接来创建一个对象

   还有一种是通过new Object()的形式创建构造函数。

通过对象字面量的形式创建对象

例如：

let obj = {
    value:10,
    setValue:function(new_value){
        this.value = new_value;
    },
    geyValue:function(){
        return this.value;
    }
}

通过构造函数的形式创建一个对象

例如:

function Person(name,age){
    this.name = name;
    this.age = age;
}

var a = new Person("张三",30);

通过new Object()创建对象

例如：

var obj = new Object();

console.log(obj); // {}

对象直接量创建的对象的使用方式

下面来说一下通过对象直接量创建的对象的一些使用方式：

属性和方法的增删改查:
例如:

// 创建一个对象直接量
var person = {
    name:"张三",
    age:40,
    sayHello:function(){
        alert(this.name,"你好");
    },
    setName:function(name){
        this.name = name;
    }
}

// 更改属性
person.name = "李四";
person['age'] = 40;

// 更改方法
person.sayHello = function(){
    return this.name + "你好";
}


// 添加属性
person.like = "旅游";

// 添加方法
person.run = function(){
    return `${this.name} 正在跑步`;
}

// 删除
delete person.age;

// 查询和调用
console.log(person.name);

console.log(person.run());

构造函数创建的对象常见的操作方式

例如:

function Person(name,age){
    this.name = name; // 初始化属性
    this.age = age;
}

Person.prototype.sayHello  = function(){
    alert(this.name);
}

// 实例化
var zhangsan = new Person("张三",20);

// 查看属性
console.log(zhangsan.name);

//. 调用方法
zhangsan.sayHello();

// 修改属性
zhangsan.name = "张小三";

// 修改方法
zhangsan.sayHello = function(){
    console.log(this.name + "你好");
}


// 添加属性和调用属性相同 ...
// 添加方法和调用方法相同 ...

// 删除
delete zhangsan.name;
console.log(zhangsan);

对象的getter 和 setter

在js对象当中，存在两个属性getter和setter，通过这两个属性我们可以进行属性的查询和赋值。

例如:

var obj =  {
    value:10,

    get add(){
        return this.value + 1;
    },
    set changeva l(new_val){
        return this.value = new_val;
    }
}

// 使用
console.log(obj.add); // 11
obj.changeva l = 20;
console.log(obj.value); // 20

应用：变量监听

例如:
html代码如下