H5十大新特性(前端面试新手必背)(13)

简介: H5十大新特性(前端面试新手必背)(13)

特点

值可以是任意的数据类型,只要是key/value形式可以保存的。 数据将永不过期,除非用户明确调用了delete()方法,或者浏览器限制了空间大小,或者其他原因(比如用户清空历史数据)数据项在整个domain(域名)内都可见。


方法

setItem(key,value): 添加一个键值对,存储

sessionStorage(会话存储)对象

getItem(key): 根据key获取值

clear(): 清空sessionStorage(会话存储)的所有键/值对

removeItem(key): 从sessionStorage 移除某个项(键值对)

key(n): 获取第n个key。


key/value

有两种方式可以把值存储到sessionStoage


// 第一种方式,标准方法
sessionStorage.setItem('email','xxx@qq.com');
// 第二种方式,直接当成普通对象属性赋值。
sessionStorage.blog = 'http://xxxxxx';


两种获取值的方法


// 1. 标准方法
var email = sessionStorage.getItem('email');
// 2. 直接取属性值
var blog = sessionStorage.blog;


移除key/value


// 移除之后,再获取值,将会得到 undefined
// 根据key,移除键值对
sessionStorage.removeItem('email');


清空sessionStorage


// 全部清除
sessionStorage.clear();


10、Web Socket

要理解这个新特性,需要有一些网络基础的知识。w3cschool对其总结很到位,所以我直接照搬过来了。WebSocket是HTML5开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。在WebSocket API中,浏览器和服务器只需要做一个握手的动作,然后,浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。浏览器通过 JavaScript 向服务器发出建立 WebSocket 连接的请求,连接建立以后,客户端和服务器端就可以通过 TCP 连接直接交换数据。当你获取 Web Socket 连接后,你可以通过 send() 方法来向服务器发送数据,并通过 onmessage 事件来接收服务器返回的数据。WebSocket 协议本质上是一个基于 TCP 的协议。为了建立一个 WebSocket 连接,客户端浏览器首先要向服务器发起一个 HTTP 请求,这个请求和通常的 HTTP 请求不同,包含了一些附加头信息,其中附加头信息"Upgrade: WebSocket"表明这是一个申请协议升级的 HTTP 请求,服务器端解析这些附加的头信息然后产生应答信息返回给客户端,客户端和服务器端的 WebSocket 连接就建立起来了,双方就可以通过这个连接通道自由的传递信息,并且这个连接会持续存在直到客户端或者服务器端的某一方主动的关闭连接。


API 用于创建 WebSocket 对象。


var Socket = new WebSocket(url, [protocal] );
//第一个参数 url, 指定连接的 URL。第二个参数 protocol 是可选的,指定了可接受的子协议。



相关文章
|
7小时前
|
前端开发 JavaScript 网络协议
前端最常见的JS面试题大全
【4月更文挑战第3天】前端最常见的JS面试题大全
54 5
|
7小时前
|
移动开发 前端开发 Android开发
mPaaS 常见问题之移动开发平台 mpaas的H5 前端 Kylin 框架引入vant后包特别大如何解决
mPaaS(移动平台即服务,Mobile Platform as a Service)是阿里巴巴集团提供的一套移动开发解决方案,它包含了一系列移动开发、测试、监控和运营的工具和服务。以下是mPaaS常见问题的汇总,旨在帮助开发者和企业用户解决在使用mPaaS产品过程中遇到的各种挑战
52 0
|
7小时前
|
设计模式 前端开发 算法
No210.精选前端面试题,享受每天的挑战和学习
No210.精选前端面试题,享受每天的挑战和学习
No210.精选前端面试题,享受每天的挑战和学习
|
7小时前
|
消息中间件 缓存 前端开发
No209.精选前端面试题,享受每天的挑战和学习
No209.精选前端面试题,享受每天的挑战和学习
No209.精选前端面试题,享受每天的挑战和学习
|
7小时前
|
前端开发 JavaScript Java
No208.精选前端面试题,享受每天的挑战和学习
No208.精选前端面试题,享受每天的挑战和学习
No208.精选前端面试题,享受每天的挑战和学习
|
7小时前
|
存储 JSON 前端开发
No206.精选前端面试题,享受每天的挑战和学习
No206.精选前端面试题,享受每天的挑战和学习
No206.精选前端面试题,享受每天的挑战和学习
|
7小时前
|
前端开发 JavaScript 开发者
【Web 前端】css3的新特性有哪些?
【4月更文挑战第22天】【Web 前端】css3的新特性有哪些?
|
7小时前
|
存储 移动开发 前端开发
【Web 前端】H5新特性有哪些?
【4月更文挑战第22天】【Web 前端】H5新特性有哪些?
|
7小时前
|
存储 前端开发 API
IndexedDB的异步操作特性对于前端开发者来说有什么挑战和注意事项吗?
IndexedDB是浏览器的客户端数据库,用于前端数据存储。其异步操作特性带来挑战,要求开发者熟悉异步编程,处理回调函数或Promise。注意事务管理,合理控制事务生命周期,防止阻塞。数据版本管理是关键,需处理升级和兼容性问题。错误处理必不可少,确保程序稳定性。性能优化涉及索引设计和查询优化,避免影响应用性能。理解并应对这些挑战,能有效利用IndexedDB构建高效Web应用。
|
7小时前
|
人工智能 前端开发 JavaScript
【前端设计】HTML+CSS+JavaScript基本特性
【前端设计】HTML+CSS+JavaScript基本特性