ES6新增属性

13.ES6

1.json概述

1.什么是json

一种轻量级的数据格式
键必须带双引号
值如果是字符串,必须带双引号

2.json能做什么

进行网络传输,其他语言也支持json
配置文件

3.json注意点

json里面不能写注释
值如果是字符串,必须带引号,值如果是字符串,也必须加
不能到json的后面加分号

4.如和把js中的对象转换成json格式的字符串

JSON.stringify(对象名称)

5.把json转换为对象或数组

JSON.parse(json格式的代码)

2.本地存储(localStorage)

存储在浏览器的本地存储技术
可以存储5M左右大小的数据
本地永久存储,需要手动删除
它不能跨域
必须是字符串的格式

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><button>添加</button><button>修改</button><button>查看</button><button>删除</button><script>// localStorage// 存储在浏览器的本地存储技术// 1.可以存储5M左右大小的数据// 2.本地永久存储,需要手动删除// 3.它不能跨越// 4.必须是字符串的格式// -----获取元素----var btn = document.querySelectorAll("button");// ----------添加---------btn[0].onclick = function () {// 1.获取已有数据,转换为数组var oUserList = JSON.parse(localStorage.getItem("user") || '[]')// 2.准备一个保存的数据var oUser = {id: 1,name: "小易",age: 22}// 3.把准备的数据,添加数组oUserList.push(oUser)console.log(oUserList);// 4.数组去覆盖原来的本地数据// 把数组转换成json格式的字符串var str = JSON.stringify(oUserList);localStorage.setItem("user", str)}// ----------修改---------btn[1].onclick = function () {// 1.获取本地数据var oUserList = JSON.parse(localStorage.getItem("user") || '[]')// 2.修改第一条数据oUserList[0].name = "易玲"console.log(oUserList);// 3.覆盖原来的数据var str = JSON.stringify(oUserList)localStorage.setItem("user", str)}// ----------查询---------btn[2].onclick = function () {// 1.获取本地数据var srt = localStorage.getItem("user")console.log(srt);var list = JSON.parse(srt)console.log(list);}// ----------删除---------btn[3].onclick = function () {// 1.获取本地数据// 根据key删除指定的数据localStorage.removeItem("user")// 清除localStorage.clear()}</script>
</body></html>

3.ES5严格模式

1.ES5引入了严格模式

1.消除一些不合理的地方

2.提高代码运行效率

2.严格模式分类

1.全局严格函数外的,全局的,use strict 必须放在代码的第一行

2.局部严格函数内的局部的

3.如何使用严格模式

“use strict”

4.全局严格的特点

不可以省略var声明变量
禁止函数使用this关键字指向全局变量
禁止使用八进制
不允许在非函数的代码块内声明函数
在严格模式下,arguments变量,形参是不会变(不同变)
作用域全局局部块级作用域在严格模式下,eval函数作用域

4.改变this指向bind,apply,call

他们都能够改变函数的this指向
bind不会立即执行,需要手动执行
apply和call都会立即执行,区别在于apply的第二个参数是一个数组

5.let作用域

如果在{}内部声明变量,外部不能访问
它防止了变量的提升,遵循先定义,后使用原则
它防止了同一个变量,不能重复声明
它声明的值,可以被修改,可以是任意类型

6.const

它声明的变量名称只能声明一次,不能重复声明
防止变量的提升
具有块级作用域
它的值类型,不能被修改
如果是引用类型,可以修改它的属性或方法,不能修改类型和地址

7.ES6 对数组增强

Array.from()将伪数组变成数组,就是只要有length的就可以转成数组
Array.of()将一组值,转换为数组

8.ES6对函数增强2个点

函数的默认参数
箭头函数
- 箭头函数的this(跟它的环境有关),它的this指向上下文对象
- 它本身没有this,利用bind,apply,call无法改变this
- 它默认情况是window(因为箭头函数的执行环境是全局的window)
- 它无法被实例化,不能被new
- 只有一个参数,可以省略小括号
- 如果代码体只有一句话,{},return 都可以省略