第31篇

1、webstroage和cookie的区别？

webStorage的概念和cookie相似，区别是它是为了更大容量存储设计的。

Cookie的大小是受限的，并且每次你请求一个新的页面的时候Cookie都会被发送过去，这样无形五浪费了带宽，另外cookie还需要指定作用域，不可以跨域调用，

除此之外，webstorage拥有setItem,getItem,removeItem, clear等方法，

不像cookie需要前端开发者自己封装setCookie，getCookie

但是cookie也是不可或缺的，cookies的作用是与服务器进行交互，作为HTTP规范的一部分而存在，而Web Storage仅仅是为了在本地“存储”数据而生

浏览器的支持除了IE7及以下不支持外。其他标准浏览器都完全支持

 

2、描述cookies、sessionStorage和localStorage的区别？

与服务器交互：

cookie是网站为了标示用户身份而储存在用户本地终端上的数据（通常经过加密）

cookie始终会在同源http请求头中携带（即使不需要），在浏览器和服务器间来回传递

sessionStorage和localStorage不会自动把数据发送给服务器，仅在本地保存。

存储大小：

cookie: 数据根据不同浏览器限制，大小一般不能超过4k。

sessionStorage和localStorage虽然也有存储大小的限制，但比cookie大的多，可以达到5M或更大

有效时间：

localStorage 存储持久数据，浏览器关闭后数据不丢失除非主动删除数据

sessionStorage 数据在当前浏览器窗口关闭后自动删除

cookie 设置cookie过期时间之前一直有效，与浏览器是否关闭无关

 

3、前端需要注意哪些SEO？

合理的title、description、keywords，搜索对这3项的权重逐个减小。

title值强调重点，重要关键词出现不要超过2次，而且要靠前，不同页面title要有所不同。

description把页面内容高度概括，长度合适，不可过分堆砌关键词。不同页面description有所不同。

keywords列举出重要关键词即可，

语义化的HTML代码，

符合W3C规范，

语义化代码让搜索引擎容易理解网页，重要内容HTML代码放在最前，搜索引擎抓取HTML顺序是从上到下，

有的搜索引擎对抓取长度有限制，保证重要内容一定会被抓取。

重要内容不要用js输出，爬虫不会执行js获取内容，少用iframe。

搜索引擎不会抓取iframe中的内容

非装饰性的图片必须加alt

提高网站速度

网站速度是搜索引擎排序的一个重要指标

 

4、如何做SEO优化？

标题与关键词：设置有吸引力切合实际的标题，标题中要包含所做的关键词

网站结构目录：最好不要超过三级，每级有“面包屑”导航，使网站成树状结构分布

页面元素：给图片标注“ALT”可以让搜索引擎更友好的收录

网站内容：每个月每天有规律性的更新网站的内容，会使搜索引擎更加喜欢

友情链接：对方一定要是正规网站，每天有专业的团队或者个人维护更新

内链的布置： 使网站形成类似蜘蛛网的结构，不会出现单独连接的页面或链接

流量分析：通过统计工具（百度统计，CNZZ）分析流量来源，指导下一步的SEO。

 

5、Class、extends是什么，有什么用？

ES6的class可以看作只是一个ES5生成实例对象的构造函数的于法堂。

参考了java语言，定义了一个类的概念，让对象原型写法更加清晰，对象实例化更像是一种面向对象编程。

class类可以通过extends实现继承。

它和ES5构造函数的不同点：

ES6的class类必须用new命令操作，而ES5的构造函数不用new也可以执行。

ES6的class类不存在变量提升，必须先定义class之后才能实例化，不像ES5中可以将构造函数写在实例化之后。

ES5的继承，实质是先创造子类的实例对象this，然后将父类的方法添加到this上面。

ES6的继承机制完全不同，实质是先将父类实例对象的属性和方法，加到this上面（所以必须先调用super方法）

然后再用子类的构造函数修改this。