1. Cookie、sessionStorage、localStorage的区别:
cookie: 存在浏览器端,默认大小为4kb,可以设置失效时间,默认诗浏览器关闭失效,每次向服务器发送http请求都被放在请求头中,
所以不能设置过大的cookie,不然会有性能问题。应用场景:用来保存用户的登陆信息;单点登录.
sessionStorage: 存储在浏览器端,默认大小为5M, 当浏览器关闭窗口失效,不参与服务器之间的通信。应用场景:购物车,html5游戏数据存储等。
localStorage: 存储在浏览器端,默认大小为5M,除非被清除,否则永远保存,不参与服务器之间的通信。应用场景:离线存储数据
安全性:存在 xss 攻击的问题,因为只要在浏览器端打开控制台就能修改,所以尽量不要存放一些敏感数据
2. JSONP原理
主要是利用了 <script> 标签能够跨域请求的机制,动态创建 <scritp> 标签,然后执行约定好的 方法回调, 需要服务器端协助。
3. 简述css盒模型
画张图说明。
4.get和post请求的区别
http 请求方式:
get: 浏览器能够缓存请求,请求数据有长度限制,编码类型(encoding type) 为 application/x-www-form-urlencoded ,
数据类型只能限制为 ASCII 字符类型,查询字符串出现在地址栏,不安全
post:浏览器不能够缓存请求,请求数据没有长度限制,编码类型:application/x-www-form-urlencoded 或者
multipart/form-data (如果是二进制数据使用 multipart 编码),数据类型没有限制,允许二进制数据。
数据参数不会出现在地址栏,在请求体中,相对来说较安全,但如果是敏感性数据,最好还是加密处理。
head: 与 get 请求类似,不同在与服务器只返回 http 头部信息,没有页面内容
put:上传指定 url 的描述
delete:删除资源
options: 返回服务器支持的 http 方法
connect:转换为 透明 tcp/ip 隧道的连接请求
5. 说说类的创建、继承和闭包
类的创建:
(1) 构造函数的方式
function Cat() {
// 属性和方法, this 指向的是实例对象
this.name = 'cat';
this.sayName = function () {
alert(this.name);
}
}
// 类属性和方法, 扩展在 构造函数 Cat 上的 prototype 上面
Cat.prototype.type = 'animal';
Cat.prototype.sayType = function () {
alert(this.type);
};
// 创建实例通过 new 关键字
var cat = new Cat();
cat.sayName();
cat.sayType();
(2) 在 javascript 中类 即是对象,所以也可以下面这种方式
var Dog = {
name: 'dog',
sayName: function () {
alert(this.name);
}
};
var dog = Object.create(Dog);
dog.sayName();
继承:
(1)构造函数绑定
function Animal() {
this.species = 'animal';
}
function Cat(name, color) {
// 在 new 对象时, this, 指代的是该对象实例
Animal.call(this, arguments);
this.name = name;
this.color = color;
this.sayHello = function () {
alert(this.species + ', ' + this.name + ', ' + this.color);
}
}
var cat = new Cat('dog', 'black');
cat.sayHello();
(2)原型继承
function Animal() {}
Animal.prototype.species = 'animal';
Animal.prototype.sayHello = function () {
alert(this.species);
};
function Dog(name, color) {
this.name = name;
this.color = color;
}
var F = function () {};
F.prototype = Animal.prototype;
Dog.prototype = new F();
Dog.prototype.constructor = Dog;
var dog = new Dog();
dog.sayHello();
(3) 拷贝继承 略
闭包:在函数中定义函数
6.什么是 “use strict”? 使用它的好处和坏处是什么
表示浏览器将以 严格模式 来解析 js代码。
好处:
(1)消除 javascript 语法的一些不合理、不严谨之处、减少一些怪异行为
(2)消除代码运行 的一些不安全之处,保证代码运行的安全
(3)提高编译器效率,增加运行速度
坏处:
代码合并时,可能会出现问题。
6.一个页面从输入 URL 到页面加载完的过程中都发生了什么事情
(1)输入地址
(2)浏览器查找域名的 IP 地址:包括 DNS 具体的查找过程:浏览器缓存 -> 浏览器缓存 -> 路由器缓存
(3)浏览器向 web 服务器发送一个 HTTP 请求
(4)服务器的永久重定向响应
(5)浏览器跟踪重定向地址
(6)服务器处理请求
(7)服务器返回一个 HTTP 响应
(8)浏览器根据返回数据的类型,解析数据
(9)如果是 html 类型则渲染页面(包括图片、音频、视频、css、js 等资源
)
(10)浏览器发送异步请求