cookies,sessionStorage 和 localStorage 的区别?
cookie是网站为了标示用户身份而储存在用户本地终端(Client Side)上的数据(通常经过加密)
cookie数据始终在同源的http请求中携带(即使不需要),记会在浏览器和服务器间来回传递
sessionStorage和localStorage不会自动把数据发给服务器,仅在本地保存
存储大小:
cookie数据大小不能超过4k
sessionStorage和localStorage虽然也有存储大小的限制,但比cookie大得多,可以达到5M或更大
有期时间:
localStorage 存储持久数据,浏览器关闭后数据不丢失除非主动删除数据
sessionStorage 数据在当前浏览器窗口关闭后自动删除
cookie 设置的cookie过期时间之前一直有效,即使窗口或浏览器关闭
箭头函数
1.只有一个参数时,可以省略() 只有一行语句的时候也可以省略{}和return
2.箭头函数里this指向的是定义时的this不是执行时的this
3.箭头函数不能用于构造函数 也没有prototype属性
4.不能用call()或apply()来改变其运行的作用域
什么是跨域,同源策略,如何解决跨域问题
1.跨域是指在浏览器上不能执行其他网站的脚本
2.同源策略指浏览器只允许访问同一协议,端口,域名的网页
3.解决跨域方法三种:
(1)CORE:服务器端对于 CORS的支持,主要就是通过设置Access-Control-Allow-Origin来进行的。如果浏览器检测到相应的设置,就可以允许Ajax进行跨域的访问–也就是常说的服务器加请求头。
(2)JSONP:借助script的src,动态的插入script标签引入一个js文件,写一个全局函数通过形参来获取数据,执行我们在url参数中指定的函数,并且会把我们需要的json数据作为参数传入
(3)vue-cli脚手架项目里的Npm模块http-proxy-middleware也可以解决
什么是闭包
闭包是指有权访问另一个函数作用域中变量的函数
在函数内部可以读取全局变量,但是不能读取函数内部变量,所以在函数内部再创建一个函数,通过创建的函数来读取局部变量
闭包的变量是在内存中,使得内存的消耗很大
浏览器是怎么对 Html5 的离线储存资源进行管理和加载的呢
在线的情况下,浏览器发现 html 头部有 manifest 属性,它会请求 manifest 文件,如果是第一次访问 app ,那么浏览器就会根据manifest文件的内容下载相应的资源并且进行离线存储。如果已经访问过 app 并且资源已经离线存储了,那么浏览器就会使用离线的资源加载页面,然后浏览器会对比新的manifest 文件与旧的 manifest 文件,如果文件没有发生改变,就不做任何操作,如果文件改变了,那么就会重新下载文件中的资源并进行离线存储。
vue的生命周期
创建(created)、模板载入(mounted)、组件更新(updated)、销毁(Destroy)
promise
1.promise是一个构造函数,且异步操作
2.成功返回resolve回调函数,失败返回reject回调函数
3.通过.then链表来取得成功后的值
好处:成功还是失败都会返回一个状态
MVVM的理解
视图(View):用户界面。(传送指令到 Controller)
控制器(Controller):业务逻辑(完成业务逻辑后,要求 Model 改变状态)
模型(Model):数据保存(将新的数据发送到 View,用户得到反)
双向绑定
Observer数据劫持,watch发布订阅,监听 DOM 改变,数据有变化更新视图层
get,post提交的区别
1.get提交把数据加在url后边去传入,并且由于url长度限制提交的数据也是有限制的
2.post提交把数据放到request body里边提交
get提交只产生一次TCP数据包 post提交产生两次TCP数据包
但get提交 数据可以放入request body里边去提交 但是提交的数据由于服务器不同,有的服务器会去拿数据有的则不会
JavaScript的基本类型
String, null, Undefined, Boolean, Number,
(Symbol, binInt, es6新增)
引用类型:Object
Call和Apply以及bind的不同
相同:都是改变this指向的方法
1.不同:call的传值是一个个去传的 apply的传值是通过数组的形式去传值
2.bind和call基本相同 不同在于call是立即执行而bind是等待执行
行内元素和块级元素有哪些区别
1)、行内元素
①:设置宽高无效
②:对margin设置左右方向有效,而上下无效,padding设置都无效
③:不会自动换行
2)、块级元素
①:可以设置宽高
②:设置margin和padding都有效
③:可以自动换行
④:多个块状,默认排列从上到下
1)、行内元素
span>、a>、br>、b>、strong>、img>、input>、textarea>、select>、sup>、sub>、em>、del>
2)、块级元素
address>、center>、h1>~h6>、hr>、p>、pre>、ul>、ol>、dl>、table>、div>、form>
display的block、inline和inline-block的区别
1)、block
会独占一行,多个元素会另起一行,可以width、height、margin和padding属性
2)、inline
元素不会独占一行,设置width、height属性无效。但可以设置水平方向的margin和padding属性,不可以设置垂直方向的padding和margin
3)、inline-block
将对象设置为inline对象,但对象的内容作为block对象呈现,之后的内联对象会被排列在同一行内
同步和异步的区别
1.同步遇到线程阻塞会等待线程执行完后,后边的线程才会执行
2.异步遇到需要等待的线程不会影响后边代码的执行
解决地狱回调的问题
1.用promise里边的asycn和await
2.asycn和await的原理就相当于generator和yieId
在遇到yieId时候相当于暂停了并且分段去执行 通过.next去取得参数
说说对this的理解
1.this总是指是指向函数的直接调用者
2.如果有new关键字的话this指向new出来的那个对象
3.在DOM事件中 this指向目标元素
4.在箭头函数中this指向他所在的函数作用域,且不可改变
Vue-router
两种方式:
1.hash ---- 利用URL中的hash(“#”)
hash虽然出现在URL中,但不会被包括在HTTP请求中。它是用来指导浏览器动作的,对服务器端完全无用,因此,改变hash不会重新加载页面
Hash:
2.利用History interface在 HTML5中新增的方法
添加对修改浏览器地址栏URL的监听是直接在构造函数中执行的
从HTML5开始,History interface提供了两个新的方法:pushState(), replaceState()使得我们可以对浏览器历史记录栈进行修改: