1、判断js类型的方式
解:a、typeof (可以判断出'string','number','boolean','undefined','symbol',但判断 typeof(null) 时值为 'object'; 判断数组和对象时值均为 'object');b、instanceof (var str=new string(‘hello’);console.log(str instanceof String); // true)。
2、ES5 和 ES6 分别几种方式声明变量
解:a、ES5有俩种:var 和 function;b、ES6 有六种:增加四种,let、const、class 和 import
3、闭包概念?闭包的优缺点?
解:概念:闭包就是能读取其他函数内部变量的函数。
优点:
a、避免全局变量的污染
b、希望一个变量长期存储在内存中(缓存变量)
缺点:
a、内存泄露(消耗)
b、常驻内存,增加内存使用量
4、深拷贝和浅拷贝
解:含义:假设B复制了A,当修改A时,看B是否会发生变化,如果B也跟着变了,说明这是浅拷贝;拿人手短,如果B没变,那就是深拷贝。
浅拷贝:
let a=[0,1,2,3,4],
b=a;
console.log(a===b); //true
a[0]=1;
console.log(a,b); 1,1,2,3,4
深拷贝:
let a=[0,1,2,3,4],
b=a.slice();
a[0]=2;
console.log(a,b); // a:2,2,3,4 b:1,2,3,4
function deepClone(obj){
let objClone = Array.isArray(obj)?[]:{};
if(obj && typeof obj==="object"){
for(key in obj){
if(obj.hasOwnProperty(key)){
//判断ojb子元素是否为对象,如果是,递归复制
if(obj[key]&&typeof obj[key] ==="object"){
objClone[key] = deepClone(obj[key]);
}else{
//如果不是,简单复制
objClone[key] = obj[key];
}
}
}
}
return objClone;
}
let a=[1,2,3,4],
b=deepClone(a);
a[0]=2;
console.log(a,b);// [2,2,3,4] [1,2,3,4]
5、数组去重方法
解:
f1:.ES6 的 Set:
let arr = [1,1,2,3,4,5,5,6]
let arr2 = [...new Set(arr)] // [1,2,3,4,5,6]
f2:reduce:
let arr = [1,1,2,3,4,5,5,6]
let arr2 = arr.reduce(function(ar,cur) {
if(!ar.includes(cur)) {
ar.push(cur)
}
return ar
},[])
f3:filter:
// 这种方法会有一个问题:[1,'1']会被当做相同元素,最终输入[1]
let arr = [1,1,2,3,4,5,5,6]
let arr2 = arr.filter(function(item,index) {
// indexOf() 方法可返回某个指定的 字符串值 在字符串中首次出现的位置
return arr.indexOf(item) === index
})
6、输入URL发生什么?
解:
a、DNS 域名解析(域名解析成ip地址,走UTP协议,因此不会有握手过程):浏览器将 URL 解析出相对应的服务器的 IP 地址(1. 本地浏览器的 DNS 缓存中查找 2. 再向系统DNS 缓存发送查询请求 3. 再向路由器DNS缓存 4. 网络运营商DNS缓存 5. 递归搜索),并 从 url 中解析出端口号;
b、浏览器与目标服务器建立一条 TCP 连接(三次握手);
c、浏览器向服务器发送一条 HTTP 请求报文;
d、服务器返回给浏览器一条 HTTP 响应报文;
e、浏览器进行渲染;
f、关闭 TCP 连接(四次挥手)。
解2:
1.输入网址;
2.发送到DNS服务器,并获取域名对应的web服务器对应的ip地址;
3.与web服务器建立TCP连接;
4.浏览器向web服务器发送http请求;
5.web服务器响应请求,并返回指定url的数据(或错误信息,或重定向的新的url地址);
6.浏览器下载web服务器返回的数据及解析html源文件;
7.生成DOM树,解析css和js,渲染页面,直至显示完成;
7、GET 和 POST 请求的区别
解:
GET 参数通过 url 传递,POST 放在 body 中;
GET 请求在 url 中传递的参数是有长度限制的,而 POST 没有;
GET 在浏览器回退时是无害的,而 POST 会再次提交请求;
GET 请求会被浏览器主动 cache,而 POST 不会,除非手动设置;
GET 比 POST 更不安全,因为参数直接暴露在 url 中,所以不能用来传递敏感信息对参数的数据类型,GET 只接受 ASCII字符,而 POST 没有限制;
GET 请求只能进行 url(x-www-form-urlencoded)编码,而 POST 支持多种编码方式;
GET 产生一个 TCP 数据包;POST 产生两个 TCP 数据包。对于 GET 方式的请求,浏览器会把 http 的 header 和 data 一并发送出去,服务器响应200(返回数据)。而对于 POST,浏览器先发送 header,服务器响应100 continue,浏览器再发送 data,服务器响应200 ok(返回数据)
8、HTTPS 与 HTTP 相比
解:
HTTPS协议需要到CA申请证书,一般免费证书很少,需要交费。
HTTP协议运行在TCP之上,所有传输的内容都是明文,HTTPS运行在SSL/TLS之上,SSL/TLS运行在TCP之上,所有传输的内容都经过加密的。
HTTP和HTTPS使用的是完全不同的连接方式,用的端口也不一样,前者是80,后者是443。
HTTPS可以有效的防止运营商劫持,解决了防劫持的一个大问题。
9、watch、methods 和 computed 的区别?
解:
a、watch 为了监听某个响应数据的变化。computed 是自动监听依赖值的变化,从而动态返回内容,主要目的是简化模板内的复杂运算。所以区别来源于用法,只是需要动态值,那就用 computed ;需要知道值的改变后执行业务逻辑,才用 watch。
b、methods是一个方法,它可以接受参数,而computed 不能,computed 是可以缓存的,methods 不会。computed 可以依赖其他 computed,甚至是其他组件的 data。
10、数组相关
解:
- push()从后面添加元素,返回值为添加完后的数组的长度
- pop()从后面删除元素,只能是一个,返回值是删除的元素
- shift()从前面删除元素,只能删除一个 返回值是删除的元素
- unshift()从前面添加元素, 返回值是添加完后的数组的长度
- concat()连接两个数组 返回值为连接后的新数组
- split(i,j)将字符串转化为数组i--分隔符,默认为所有的空字符,包括空格、换行(\n)、制表符(\t)等。j--分割次数。默认为-1, 即分隔所有
- sort()将数组进行排序,返回值是排好的数组,默认是按照最左边的数字进行排序,不是按照数字大小排序的
- reverse() 将数组反转,返回值是反转后的数组
- slice(start,end) 切去索引值start到索引值end的数组,不包含end索引的值,返回值是切出来的数组
- forEach(callback) 遍历数组,无return callback的参数: value --当前索引的值 index --索引 array --原数组
- map(callback)映射数组(遍历数组),有return 返回一个新数组 callback的参数: item--当前索引的值 index --索引 arr --原数组
- filter(callback)过滤数组,返回一个满足要求的数组
- join()方法用于把数组中的所有元素放入一个字符串。元素是通过指定的分隔符进行分隔的。默认为,;
13、Promise.all()用法
解:Promise.all()批量执行,Promise.all([p1, p2, p3])用于将多个promise实例,包装成一个新的Promise实例,返回的实例就是普通的promise