js5.9

JavaScript的cookie

cookie是用来储存web页面的用户信息
由于http是一种无状态的协议，服务器单从网页链接上是无法获取用户信息的。这个时候服务器会给用户端（浏览器）颁发一个cookie，用来确认用户信息。

cookie获取方式

documen.cookie=“name=value;domain=.domain.com;path=/;expires=;”

name:一个唯一确定的cookie名称，通常cookie不区分大小写。
value:存储在cookie中的字符串，最好为cookie的name和value进行url编码。
domain：cookie对哪个域是有效的，例：www.baidu.com

path:表示这个cookie影响到的路径，浏览器会根据这个配置项，向指定的域中匹配的路径发送cookie
expires:失效时间，表示cookie何时被删除（停止向服务器发送cookie）时间是GMT格式的设置过去的时间，直接删除，默认是会话缓存(关闭浏览器删除)
max-age:与expires效果相同 max-age优先级高于expires

httpOnly:告知浏览器不允许通过脚本document.cookie去更改这个值，同样这个值在document.cookie中也不可见。但在http请求时仍然会携带这个cookie。注意这个值虽然在脚本中不可获取，但仍然在浏览器安装目录中以文件形式存在，通常在服务器端设置。

secure:安全标志，指定后，只有在使用SSL链接时才能发送到服务器，如果是http链接则不会。

cookie的封装

封装:
1.相同的地方不做处理
2.不同的部分使用参数表示

• function setCookie(name,value,time){
  var oDate=new Date();
  oDate.setDate(oDate.getDate()+time);
  document.cookie=${name}=${value};expires=${oDate}
  }

setCookie(“name”,“孙悟空”;30);
setCookie(“name2”,“猪八戒”;20);
setCookie(“name3”,“沙僧”，10)；

• function getCookie(key)={
  var arr=document.cookie.split("; ")

for(var i=0;i<arr.length;i++){
var arrItem=arr[i].split(“=”);
if(arrItem[0]==key){
console.log(arrItem[1])
}
}
}

• 删除 设置失效时间为之前的时间即可删除指定项

function removeCookie(key){
setCookie(key,“”,-1)
}

• 清空
  function clearCookie(){
  var arr=document.cookie.split(“; “);
  for(var i=0;i<arr.legth;i++){
  var arrItem=arr[i].split(”=”);
  setCookie(arrItem[0],“”,-1)
  }
  }

sessionStorage 会话缓存

缓存时间为当前tab页面浏览器打开期间 关闭浏览器就清除

属性

• length 缓存数据的条数
  设置 sessionStorage.setItem(“key”,“value”);
  例: aBtns[0].οnclick=function(){
  sessionStroage.setItem(“name”,“孙悟空”)
  }

• 获取 sessionStorage.getItem(“key”)
  例: aBtns[1].οnclick=function(){
  console.log(sessionStroage.getItem(“name”))
  }

• 删除 sessionStroage.removeItem(“key”)
  例:oBtns[2].οnclick=function(){
  sessionStroage.removeItem(“name”)
  }

• 清空 sessionStroage.clear()
  例:oBtns[3].οnclick=function(){
  sessionStroage.clear()
  }

localStroage 本地缓存

缓存时间为永久除非手动删除

属性

• length 缓存数据的条数

• 设置 localStroage.setItem(“key”,“value”)
  例:aBtns[0].οnclick=function(){
  localStroage.setItem(“name”,“孙悟空”)
  }

• 获取 localStroage.getItem(“key”)
  例:aBtns[1].οnclick=function(){
  localStroage.getItem(“name”)
  }

• 删除 localStroage.removeItem(“key”)
  例:aBtn[2].οnclick=function(){
  localStroage.removeItem(“name”)
  }

• 清空 localStroage.clear()
  例: aBtns[3].οnclick=function(){
  localStroage.clear()
  }

全局属性和方法

属性

• Infinity 代表正的无穷大的数值

• NaN 表示某个值不是一个数字 Not a Number

• undefined 指未定义的值

全局方法

• eval() 计算JavaScript字符串,并把它作为脚本代码执行

• decodeURI() 解码某个编码的URL

• encodeURI() 将字符串编码为URL

• decodeURIComponent() 解码一个编码的URI组件

• encodeURIComponent() 把字符串编码为URI组件

• escape() 对字符串进行编码

• unescape()对由escape()编码的字符串进行解码

• isFinite() 检查某个值是否为有穷大的数
  isNaN() 检查某个值是否不是一个数字

• Number()把对象的值转换为数字

• parseFloat 解析一个字符串并返回一个浮点数(小数)

• parseInt() 解析一个字符串并返回一个整数
  String() 字符串

JavaScript的console对象

log() 控制台输出一条日志

info() 控制台输出一条信息

warn(name,message) 输出警告信息，信息前面加一个黄色三角表示警告

error(name,message) 输出错误信息到控制台，信息前面加一个红色X表示错误

clear()清空控制台信息

time() 计时器开始计时 与timeEnd()联合使用，用于计算初一个操作花费的准确时间
timeEnd() 计时结束

count()记录count()调用的次数，一般用于计数

table() 以表格形式显示数据

group()控制台创建一个信息分组.一个完整的信息分组以console.group()开始，console.groupEnd()结束

groupCollapsed() 在控制台创建一个信息分组。类似console.group()，但它默认是折叠的

groupEnd() 设置当前信息分组结束
console.group()分组开始默认展开

assert(“判断语句”,“判断条件不成立输出内容”) 如果断言为false，则在控制台输出错误信息

trace() 显示当前执行的代码在堆栈中调用的路径。

JavaScript中的undefined和null的区别

undefined和null在js都表示"无"
null是一个表示"无"的对象，转换为数值为0
undefined是一个表示"无"的初始值，转换为数值为NaN

• null的用法
  1.作为函数的参考，表示该函数的参数不是对象
  2.作为对象圆型链的终点
  3.清空变量

• undefined的用法
  1.变量被申明了，但是没有赋值时，返回undefined
  2.调用函数时，应该提供参数但是没有提供，该参数为undefined
  3.对象没有赋值的属性，该属性值为undefined
  4.函数没有返回值时，默认返回undefined

JavaScript中void关键字

Javascirpt:void(0)中最关键的是void关键字，void是JavaScript中非常重要的关键字，该操作符指定要计算一个表达式但是不返回值

语法
javascript:void func()
javascript:void(func())

JavaScript中的debugger

debug:调试

如何在js代码中手动造成/添加一个断点效果？

用debugger

if(true){
debugger;
}
for(var i=0;i<10;i++){
debugger;
console.log(i)
}