(17.05.10)cookie、存数据、日期时间？、localStorage、序列化/持久化、模拟多窗口通信、sessionStorage、ES6、声明变量、声明常量、字符串拼接、解构赋值、扩展运算符

cookie     存储
    以站点为单位的。
    必须配合服务器环境
    不能跨浏览器

    cookie有生命周期     默认是session
        session         会话
            打开页面会话开始
            关闭浏览器会话结束
    名字不能重复
    容量有限:   4KB

如何存数据？

        document.cookie = 'name=value';

        document.cookie = 'name=value; PATH=/';

        document.cookie = 'name=value; PATH=/; EXPIRES='+oDate;
    如何取数据？
        document.cookie
    如何删除数据？
        把过期时间设置到以前

什么时候使用？
如何使用？

    拖拽
        存
            鼠标抬起存
        取
            页面加载取
    选项卡
        存
            切换之后存
        取
            页面加载取

    记住用户名
        存
            登录时存
        取
            页面加载取

日期时间

        高级浏览器
        Wed May 10 2017 10:55:51 GMT+0800 (中国标准时间)
        低版本ie
        Wed May 10 10:57:01 UTC+0800 2017 

        oDate.toGMTString()
        或者
        oDate.toUTCString()

---

localStorage    本地存储

        cookie          localStorage                
大小  4KB             5MB
操作  麻烦          简单
过期  有默认是session 没有过期时间
复杂  很多属性        key , value
本地化     不是          是

---

    window.localStorage

    存
        localStorage.名字 = 值;
    取
        localStorage.名字;
    删
        delete localStorage.名字;

---

localStorage存入的所有的东西都变成了字符串

    存入
        [1,2,3,4,5]
    变成
        '1,2,3,4,5'

    存入
        {"a":12,"b":5}
    变成
        '[object Object]'

序列化、持久化
    对象-》字符串

    var str = JSON.stringify(obj)

    eg:
        var str = JSON.stringify([1,2,3,4]);

        '[1,2,3,4]'

    eg2:
        var json = {"name":"lucy","age":12};
        var str = JSON.stringify(json);

        '{"name":"lucy","age":12}'

反序列化、反持久化
    字符串-》对象

    var obj = JSON.parse(str);

    '{"name":"lucy","age":12}'
    {"name":"lucy","age":12}

    '[1,2,3,4]'
    [1,2,3,4]


存的时候：序列化
    JSON.stringify(obj);
取的时候：反序列化
    JSON.parse(str)

---

可以模拟多窗口通信

        window.onstorage
        当localStorage的值改变的时候触发
        window.onstorage = function(ev){
            ev.key          被改的名字
            localStorage[ev.key]    被改的值
        };

    localStorage的兄弟
    sessionStorage
        跟localStorage    一模一样，任何操作都一模一样
        唯一一点区别就是sessionStorage有过期时间
            过期时间：session，关闭浏览器的时候

---

ES6

ECMAScript 6        ECMAScript.next

    ES标准
        JavaScript
        TypeScript      微软出的
            AngularJS从2.0开始
        ActionScript    Flash
历史
    ES1.0       
    ES2.0
    ES3.0           
    ES4.0           干掉了。
    ES3.1           4.0的阉割版     harmony
    ES5.0
    ES6.0

    ES5.0和ES6.0沦为后台
    NodeJS

---

声明变量

        let 名字 = 值;
        块级作用域
            {

            }
        不允许重复声明

声明常量

        不能改变
        一经声明，就不能改变了。
        const 名字 = 值;
        不允许重复的声明
        必须声明的时候直接给值
        const a;        a = 5           不允许

---

字符串拼接

    var name = '张三';
    var age = 18;
    var str = '我叫"'+name+'",今年"'+age+'"岁';

    新写法
    var str = `我叫"${name}",今年"${age}"岁`;

---

解构赋值

        let [a,b] = [12,5];
        let [a,[b,c],d] = [12,[5,3],8];
        var {a,b} = {a:12,b:5};

        let left = 0;
        let top = 0;
            var json = {
                left:left,
                top:top
            }
            等
            var json = {
                left,
                top
            }

        function changeColor(obj,color='black'){
            相当于
            color = color||'black'';

        }

---

扩展运算符

        var arr = [1,2,3]
        var arr2 = [...arr];
        只能玩数组

        function sum(...args){
            args    相当于 arguments
        }

---

function show(a){
    var json = {b:5};
    delete json.b;
    alert(json.b);          undefined
    delete a;               
    alert(a);               12
}
alert(show(12));            undefined

作业:
聚划算
课件