便利蜂 2019 秋季(11 月)web 前端笔试题
前端技能试题 v2.6
一, 单选题(总共 8 分, 每题 2 分)
1, 以下不属于 HTTP 缓存控制协议头是( )
A. Cache-Control B. Content-Type C.Etag D.Vary
考点: Web 缓存只 http 技术
答案: B
分析: 已经系统了解了 Web 缓存策略, 总结了笔记, 可以点此 https://www.kancloud.cn/dshvv/interview/1370704 查看. Content-Type 是响应头告诉浏览器返回的资源的 MIME 类型.
2,cookie 特性下列说法正确的是( )
A. cookie 没有长度限制, 可以无限存储
B. 浏览器可以获取任一域名的 cookie
C. cookie 不需要手动处理, 请求时会自动携带
D. 浏览器请求 image 时不会携带 cookie
考点: Web 缓存只本地存储技术中的 cookie
答案: D
分析: cookie 的个小, 条数都有限制. 不同浏览器表现也不一值.
大概都给 4kb 空间, 每个域名 50 条左右. 超出这阀门后, 将会被忽略
cookie 获取有严格限制, 不同域名 (domain) 下无法取的, 同域名不同路径下 (pach) 下也不能取得. 必须是同域名, 和同路径(以及父子路径)
只要设置了 cookie, 浏览器每次请求均会自己携带. 所以 c 对, d 不对
3,cors 中不属于简单请求的请求类型是()
A. GET B. HEAD C.POST D.DELETE
考点: 跨域技术之 cors
答案: C
分析: CORS 即跨来源资源共享, 通俗说就是我们所熟知的跨域请求.
众所周知, 在以前, 跨域可以采用代理, JSONP 等方式, 而在 Modern 浏览器面前, 这些终将成为过去式, 因为有了 CORS.
CORS 可以分成两种: 简单请求, 复杂请求. 一个简单的请求大致如下
- // HTTP 方法是下列之一
- HEAD
- GET
- POST
- // HTTP 头信息不超出以下几种字段
- Accept
- Accept-Language
- Content-Language
- Last-Event-ID
Content-Type, 但仅能是下列之一
- application/x-www-form-urlencoded
- multipart/form-data
- text/plain
4, 关于 https 以下描述错误的是()
A. http 是超文本传输协议, 信息是明文传输. https 则是具有安全性的 ssl/tsl 加密传输协议
B. https 一直使用非对称加密协议来保证数据安全
C. http 默认使用 80 端口, https 默认使用 443 端口来进行通信
D. https 公钥默认使用 CA 证书进行签名方式防止被修改
考点: 网络传输协议之 https
答案: D
分析: 考察 https 相关知识点. https 证书需要自己申请, 默认没有
二, 多选题(总分 20 分, 每题 4 分)
1, 已知
- // finally 方法的回调函数不接受任何参数, 所以 data 参数无意义, 永远是 undefined
- fn.finally((data)=>{
- console.log(data);
- });
请选择正确的 fn, 保证打印输出为'我爱中国'()
A.
- fn = new Promise((res,rej)=>{
- setTimeout(()=>{
- res('我爱中国');
- });
- // 第一步:
- // promise 一旦状态改变就不会再变, 所以上边定时器没有意义, 将只会执行 rej,
- // 加了个 return 是防止构造函数内之后的代码执行, 这里 return 后边没代码, 所以没有意义, 干扰视觉
- return rej('我爱中国');
- }).then(
- data => {
- return Promise.resolve(data);
- },
- data => {
- // 第二步:
- // 这里抛出的异常, 又没有 catch 处理, 所以会报错, 此函数内程序终止, 但是不影响外边的(比如 finally)
- throw 'I LOVE CHINA';
- }
- )
- // 第三步执行题目代码 finally
- // 最终执行结果: 先打印 undefined, 再报错
B.
- // 没有 then 处理状态改变, 所以 resolve 也无意义, 最后执行题目的 finally
- fn = Promise.resolve('我爱中国');
- // 最终执行结果: 打印 undefined
C.
- // 触发了 reject 状态,
- // 但是 then 却没有第二个回调(其实连 then 都没有), 所以会走到 catch, 并将值传入 catch 的回调内
- fn = Promise.reject('我爱中国').catch((data)=>{// 所以 data 是'我爱中国'
- Promise.resolve(data);// 但是这里又定义了个 promise 对象, 最后也没人使用, 所以这个也没有意义
- })
- // 接着走题目的 finally
- // 最终执行结果: 打印 undefined
D.
- // 没有 then 的第二个参数, 也没有 catch, 所以只会执行 finall, 最终打印 undefined
- fn = Promise.reject('我爱中国');
答案: 这题是个坑, 没有一个对的选项
分析:
- /*
- Promise 有三种状态, pending(进行中),fulfilled(已成功, 也叫做 resolve)和 rejected(已失败)
- 其状态一旦改变, 就不会再变
- */
- let pm = new Promise((resolve,reject)=>{
- });
- /*
- Promise 有 3 个实例方法 then,catch,finally
- then: 状态变更会执行此函数, 此函数传入两个回调(非必须全传)
- */
- pm
- .then(()=>{
- // 状态为 resolve 的回调
- },()=>{
- // 状态为 rejected 的回调
- })
- .catch((e)=>{
- // 用于补货构造及其 3 个实例函数的异常, 需要注意的是如果 then 中没有第二个参数也会走到 catch
- })
- .finally(()=>{
- // 不管 promise 最后的状态, 在执行完 then 或 catch 指定的回调后, 都会执行 finally 方法指定的回调
- })
考点: es6 的 Promise
三, 简答题(总分 52 分)
1, 有如下代码
- const MENU = {
- 'FE':'前端开发工程师',
- 'DEV':'后端开发工程师',
- 'QA':'测试开发工程师'
- };
- function getTestScore(...args){ // 第一步:" 数组的扩展运算符, 将一个个参数反转为数组
- const [userInfo = {}, type = 'FE'] = args; // 第二步: 数组的解构赋值, 解构赋值时的默认值.
- const { userId } = userInfo; // 第三步: 解构 userInfo 对象里边的 userId 属性
- consle.log(` 我的名字叫 ${userId}, 职位是 ${MENU[type]}`); // 第四步: 打印
- };
请根据要求, 分析答案.(如有异常, 填写报错并指出报错代码段)
- (1)getTestScore(); // 我的名字叫 undefined, 职位是前端开发工程师
- (2)getTestScore('DEV');// 我的名字叫 undefined, 职位是前端开发工程师
- (3)getTestScore(null,'QA');//Cannot destructure property `userId` of 'undefined' or 'null'
考点: es6 变量的解构运算符, es6 的扩展运算符
答案: 已在题目后标出
分析: 一段针对一个分析, 下边是具体
没有任何参数, 所以第二步解构的无果, 均用默认值. 所以 userInfo 解构的 userId 为 undefined,type 为 FE
只有 DEV 一个参数, 这个参数将会被映射到 userInfo 上, 而 type 依然是默认值. 因为 UserInfo 被解构为字符串 DEV 所以会再被隐式转换为对象去解构 userId, 为 undefined.type 为 FE
第三种情况, null 不能被解构, 直接挂了
来源: http://www.bubuko.com/infodetail-3282372.html