撩课-Web大前端每天5道面试题-Day31
1.web storage和cookie的区别?
Web Storage的概念和cookie相似,
区别是它是为了更大容量存储设计的。
Cookie的大小是受限的,
并且每次你请求一个新的页面的时候Cookie都会被发送过去,
这样无形中浪费了带宽,
另外cookie还需要指定作用域,
不可以跨域调用
除此之外,
WebStorage拥有setItem,getItem,removeItem,clear等方法,
不像cookie需要前端开发者自己封装setCookie,getCookie 但是cookie也是不可以或缺的:
cookie的作用是与服务器进行交互,
作为HTTP规范的一部分而存在 ,
而Web Storage仅仅是为了在本地“存储”数据而生
浏览器的支持除了IE7及以下不支持外,
其他标准浏览器都完全支持(ie及FF需在web服务器里运行),
值得一提的是IE总是办好事,
例如IE7、IE6中的userData其实就是javascript本地存储的解决方案。
通过简单的代码封装可以统一到所有的浏览器都支持web storage
localStorage和sessionStorage都具有相同的操作方法,
例如setItem、getItem和removeItem等
2.描述 cookies、sessionStorage 和 localStorage 的区别?
与服务器交互:
cookie 是网站为了标示用户身份而储存在用户本地终端上的数据(通常经过加密)
cookie 始终会在同源 http 请求头中携带(即使不需要),在浏览器和服务器间来回传递
sessionStorage 和 localStorage 不会自动把数据发给服务器,仅在本地保存 存储大小:
cookie 数据根据不同浏览器限制,大小一般不能超过 4k
sessionStorage 和 localStorage 虽然也有存储大小的限制,但比cookie大得多,可以达到5M或更大 有期时间:
localStorage 存储持久数据,浏览器关闭后数据不丢失除非主动删除数据
sessionStorage 数据在当前浏览器窗口关闭后自动删除
cookie 设置的cookie过期时间之前一直有效,与浏览器是否关闭无关
3.前端需要注意哪些SEO?
合理的title、description、keywords:
搜索对着三项的权重逐个减小,
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构造函数的不同点 类的内部定义的所有方法,都是不可枚举的 ///ES5
function ES5Fun (x, y) {
this.x = x;
this.y = y;
} ES5Fun.prototype.toString = function () {
return '(' + this.x + ', ' + this.y + ')';
}
var p = new ES5Fun(, );
p.toString();
Object.keys(ES5Fun.prototype); //['toString'] //ES6
class ES6Fun {
constructor (x, y) {
this.x = x;
this.y = y;
}
toString () {
return '(' + this.x + ', ' + this.y + ')';
}
} Object.keys(ES6Fun.prototype); //[]
ES6的class类必须用new命令操作,
而ES5的构造函数不用new也可以执行。
ES6的class类不存在变量提升,
必须先定义class之后才能实例化,
不像ES5中可以将构造函数写在实例化之后。
ES5 的继承,实质是先创造子类的实例对象this,
然后再将父类的方法添加到this上面。
ES6 的继承机制完全不同,
实质是先将父类实例对象的属性和方法,
加到this上面(所以必须先调用super方法),
然后再用子类的构造函数修改this。
撩课-Web大前端每天5道面试题-Day31的更多相关文章
- 撩课-Web大前端每天5道面试题-Day10
1. px和em的区别? px和em都是长度单位; 区别是: px的值是固定的,指定是多少就是多少, 计算比较容易. em得值不是固定的,并且em会继承父级元素的字体大小. 浏览器的默认字体高都是16 ...
- 撩课-Web大前端每天5道面试题-Day4
1. 如何实现瀑布流? 瀑布流布局的原理: ) 瀑布流布局要求要进行布置的元素等宽, 然后计算元素的宽度, 与浏览器宽度之比,得到需要布置的列数; ) 创建一个数组,长度为列数, 里面的值为已布置元素 ...
- 撩课-Web大前端每天5道面试题-Day1
1. var的变量提升的底层原理是什么? JS引擎的工作方式是: 1) 先解析代码,获取所有被声明的变量: 2)然后在运行.也就是说分为预处理和执行两个阶段. 变量提升:所有变量的声明语句都会被提升到 ...
- 撩课-Web大前端每天5道面试题-Day11
1. 如何手写一个JQ插件? 方式一: $.extend(src) 该方法就是将src合并到JQ的全局对象中去: $.extend({ log: ()=>{alert('撩课itLike');} ...
- 撩课-Web大前端每天5道面试题-Day25
1.web前端开发,如何提高页面性能优化? 内容方面: .减少 HTTP 请求 (Make Fewer HTTP Requests) .减少 DOM 元素数量 (Reduce the Number o ...
- 撩课-Web大前端每天5道面试题-Day7
1. 你能描述一下渐进增强和优雅降级之间的不同吗? 定义: 优雅降级(graceful degradation): 一开始就构建站点的完整功能, 然后针对浏览器测试和修复 渐进增强(progressi ...
- 撩课-Web大前端每天5道面试题-Day30
1.什么叫优雅降级和渐进增强? 优雅降级: Web站点在所有新式浏览器中都能正常工作, 如果用户使用的是老式浏览器, 则代码会针对旧版本的IE进行降级处理了, 使之在旧式浏览器上以某种形式降级体验却不 ...
- 撩课-Web大前端每天5道面试题-Day23
1.为什么用Nodejs,它有哪些优缺点? 优点: 事件驱动,通过闭包很容易实现客户端的生命活期. 不用担心多线程,锁,并行计算的问题 V8引擎速度非常快 对于游戏来说,写一遍游戏逻辑代码,前端后端通 ...
- 撩课-Web大前端每天5道面试题-Day16
1.for循环中的作用域问题? 写出以下代码输出值,尝试用es5和es6的方式进行改进输出循环中的i值. ; i<=; i++) { setTimeout(function timer() { ...
随机推荐
- 程序猿的日常——Mybatis现学现卖
最近有一个小项目需求,需要用spring mvc + mybatis实现一个复杂的配置系统.其中遇到了很多不太常见的问题,在这里特意记录下: 主要涉及的内容有 事务 多表删除 插入并返回主键 1 sp ...
- servlet实现商品商场项目
1.1 1.创建四个包DButils reposiable service servletJPK DButils包中的类jdbcutils.java 用于获取工具类DButils工具类的DataSou ...
- git fetch 、git pull 与 git pull --rebase
1. git fetch 与 git pull 都是从远程拉取代码到本地,git fetch只是拉取到本地,git pull不仅拉取到本地还merge到本地分支中.所以git pull是git fet ...
- sync.Pool 资源池
sync.Pool type Pool struct { // 可选参数New指定一个函数在Get方法可能返回nil时来生成一个值 // 该参数不能在调用Get方法时被修改 New func() in ...
- 初识java java的加载与执行(JDK,JVM,JRE关系解释)
首先java代码是以 .java结尾的文件,通过javac命令编译生成.class编译生成字节码文件,再通过java命令,把字节码文件加载到内存内部,此时是类加载器ClassLoader执行加载,通过 ...
- Flask 微博三方登录
1.进入微博开发平台(https://open.weibo.com/),注册账号,填写开发者信息 2.创建应用.创建应用完成后,可以在"我的应用 - 应用信息"中查看您所创建应用的 ...
- 10 Tips for Optimizing Your Website’s Speed
转自:http://sixrevisions.com/web-development/site-speed-performance/ Web page speed and performance is ...
- Prototype原型模式(创建型模式)
1.原型模式解决的问题 现在有一个抽象的游戏设施建造系统,负责构建一个现代风格和古典风格的房屋和道路. 前提:抽象变化较慢,实现变化较快(不稳定) 整个抽象的游戏设施建造系统相对变化较慢,本例中只有一 ...
- 工具-infer,静态代码检测
1.工具介绍 Infer 是一个静态程序分析工具,可以对 Java.C 和 Objective-C 程序进行分析,此工具是用 OCaml写成的.https://github.com/facebook/ ...
- mybatis随笔二之SqlSessionFactory
在上一篇文章我们已经得到了DefaultSqlSessionFactory @Override public SqlSession openSession() { return openSession ...