首页 > 笔经面经 > 大疆 前端一面 附答案分析

大疆 前端一面 附答案分析

头像
阿布布布
编辑于 2019-11-19 21:46:17 APP内打开
赞 4 | 收藏 10 | 回复1 | 浏览3811
每天刷一篇面经,争取早日上岸!!!
大疆 校招前端 一面
  1. ES6的新特性有哪些?
  2. async的实现原理
  3. css左固定右自适应
  4. 讲一下同源策略
  5. csrf的防御方法
  6. token放在什么位置?
开始查答案!
1.ES6的新特性:
1)const和let。都是块级作用域,const用来定义常量、必须初始化、不能重新赋值,let定义变量。使用要注意暂时性死区问题(因为两个都不会进行变量提升)。
2)模板字面量。在``内写表达式,${}表示占位符。
3)解构赋值。
4)对象字面量简写法。使用和分配的名称一样 比如 name:name 就可以简写成 name
5)for of 循环。可以迭代任何可以迭代的,除了对象。
6)...展开运算符。
7)箭头函数
8)class
9)import、export导入导出
10)Set(集合)、Map(字典)。主要用于 数组去重、数据存储。
11)Symbol。基本类型,产生唯一值。

2.async的实现原理
最开始的回调函数是callback,同步回调,需要等待,尤其进行需要顺序执行的就会产生大名鼎鼎的回调地狱。然后就有了promise进行异步执行,无需等待回调通过.then()直接进行在一个异步操作,但还是有缺点,无法精准的捕获错误。所以就加上了generator生成器,然后promise+generator就组成异步迭代生成器,也就是每次promise决议之后yied停一下,看一下有没有错误,没错误继续下一个,这样就可以实现错误的捕获了。但是这样实现起来是很麻烦的,就在这时候ES6推出了async..await 就是上面异步迭代生成器的语法糖,更好用了,但底层是一个意思。有了这样的一个思路,去查代码实现什么的就好理解了。

3.css左固定右自适应
方法一:浮动。让左边浮动脱离文档流并设置固定宽度,然后右边设置overflow为auto。
.left {
    float: left; 
    width: 200px;
    height: 200px;
    background-color: aqua;
}
.right {
    overflow: auto;
    height: 300px;
    background-color: bisque;
}
方法二:绝对定位。左边设置为绝对定位固定宽度(也是脱离了文档流),右边设置margin-left为左边宽度。
.left {
    position: absolute;
    width: 200px;
    height: 200px;
    background-color: aqua;
}
.right {
    margin-left: 200px;
    height: 300px;
    background-color: bisque;
}

4.讲一下同源策略
浏览器的安全功能。同源是指 协议、域名、端口号要一致。如果不同源会产生跨域问题。

5.csrf的防御方法
1)验证 HTTP Referer 字段。该字段记录了请求的来源地址,每次都进行检查请求地址和网站域名是否相同,不同则判定为csrf攻击。缺点,有一些浏览器可以篡改Referer字段,有些浏览器也可以设置请求头不懈怠Referer字段。
2)在请求地址中添加token。添加一些从cookie中获取不到的信息,然后生成随机token,最后服务端截取验证,如果没有或者不对则判定为csrf攻击。

6.token放在什么位置?
前端token可以存放在webStorage中,sessionStorage关闭浏览器自动清除,localStorage长期有效。在每次发送请求的时候都在header中带上token。

今天发生了点事情,时间很紧迫!就只能先写这么多了!白白~

1条回帖

回帖
加载中...
回帖

相关热帖

笔经面经近期热帖

近期精华帖

热门推荐