一次經歷 一次筆試

遇到了不少大佬,涼透了一回筆試。開心,又心累。

最近忙什麼

八月末,接到學院老師的電話,說有一份實習可以讓我試試。大致訂下了時間,第二天先和同學吃飯吹水,第三天一大早就坐上動車,前往假·省城。

個中過程不敘。總之,是打算先幫助團隊完成他們負責的工作,週末前往真·省城。部署了機房的機器,之後就給老師當當助教。

同是一個專業的,感覺班級間的交流氛圍,和他們的興趣三觀,都比較契合吧,聊得也很開心。只可惜不能呆久一點就是了。

一週也就過去了。現在,在宿舍望着教務網裏,沒多少的課表,想着之後要怎麼辦。😔️

一次涼涼的阿里筆試

週三下午和週四沒有任務,在酒店里收到了之前滄海亂投的「一粟」。(其實也有其他面試,但都錯過了,心累)

下面 po 一下題目。(先列出知識點,然後繼續努力)

下列哪一项不是 Hybrid 应用架构的优势:

能够带来更好的 Web 页面渲染性能
能够利用操作系统的原生能力
能够突破浏览器的缓存限制,扩展更强的缓存功能
开发成本较低,可以跨平台
可以比较自由的更新代码
针对开发新手,非常地友好,易于上手

知識點:Hybrid,緩存

如果仅是为了缓存数据,采用 localStorage 比 Cookie 更好
二级域名的页面请求时,同时会携带主域名的 Cookie
对 Cookie 进行加密,可以降低 cookie 被截获后窃取服务端数据的风险
客户端可以设置 Cookie
服务端可以设置 Cookie
Cookie 的值是有大小限制的

知識點:Cookie,Web Storage

关于 HTTP 请求的 Status Code,正确的是:

判断请求成功仅需判断 status === 200
未登录错误为 302
403 一般是由于用户登录但权限不够造成的
307 可以完全用 301 代替实现
404 错误不会被缓存
相比 301,302 对搜索引擎更友好

知識點:HTTP status codes

參考鏈接:Wikipedia - List of HTTP status codes

下面关于 React 和 Vue 的说法正确的是:

Vue 的性能非常好,不可能将原生 JavaScript 代码优化到 Vue 的性能
Vue 体积比 React 小,所以运行性能全面好于 React
React16 引入新的生命周期可以捕获 Component 的错误
Vue 的服务端渲染非常快,比字符串模版渲染还要快
React 没有办法从子组件向父组件传递值
Vue1 和 Vue2 都不支持服务器渲染

知識點:React,Vue,渲染機制,組件化,生命週期

盒模型不包含以下哪一个属性?

padding
content
border
margin
width
height
position

知識點:CSS,盒模型

參考鏈接:Wikipedia - CSS box model

以下关于 JavaScript 的堆栈的描述正确的是:

JavaScript 的 String、Array 类型的数据都是放在栈内存里的
JavaScript 的引用类型是放在堆内存里的
栈的读取顺序是先进先出的
堆的读取顺序是先进后出的
栈内存会由系统自动分配释放
堆内存是大小固定的

知識點:數據結構,堆,棧

关于跨域,以下说法正确的是:

jsonp 可以跨域
fetch 可以跨域
ajax 可以跨域
postMessage 可以跨域
为了防止跨域请求攻击,服务端需要判断 cookie 信息
采用 token 机制跨域防止跨域攻击

知識點:跨域,JSONP,Fetch,AJAX,postMessage,Cookie,token機制

下面哪些功能 Service Worker 可以完成:

Mock 数据请求
主动拉取资源文件,并将其缓存
当请求数据时候服务器 404,自动降级成兜底数据
将离线时的打点数据存起来,等到联网后再传输
直接对DOM进行操作
浏览器关闭后,依然常驻

知識點:模擬請求,緩存機制,請求,DOM,Service Worker

下面关于性能优化正确的是:

PNG 图片永远比 JPG 图片小,所以应当尽量使用 PNG
CSS 不能放在 <body> 底部,因为会导致页面重新渲染
尽量不要使用 with,因为 with 内的代码执行效率会变低
PNG 图片压缩是没用的,因为其算法和 gzip 算法都是无损压缩,所以并不能减少图片大小
浏览器创建和维持 HTTP链接是需要性能消耗的,所以应当尽量减少同时存在 HTTP 链接的数量
只能通过服务器检验来确定浏览器是否支持 WebP,JavaScript 没办法检验浏览器是否支持

知識點:圖片壓縮,WebP,gzip,HTTP,CSS

以下哪些关于 npm 安装包的说法错误的:

使用 npm install -g my-pkg 可以将包安装到全局
npm install [email protected]可以安装1.0以上版本
npm i my-pkg也可以安装
npm install @latest/my-pkg是错误的写法
npm install git://github.com/npm/npm.git是正确的用法
npm install my-pkg --latest可以安装包的最新版本

知識點:Node.js,NPM包管理器

请根据描述使用 JavaScript 实现函数 _bind 模拟原生 bind 方法,并通过测试用例:

1
2
3
4
5
6
7
8
9
10
function func(x){
console.log(x, this.y)
}

//your code here

//测试用例
func._bind({y: 'foo'})() //undefined "foo"
func._bind()() //undefined undefined
func._bind({y: 'bar'}, 'foo')() //"foo" "bar"

知識點:原型鏈

題解(通過 Node.js 驗證,但不一定是最好寫法)

异步请求逻辑注入

工作中我们需要对异步请求的请求信息打印日志,但是又不能耦合在业务代码中打印。请设计一个方法injectBeforeAsyncSend,能够实现如下功能:在发起异步请求之前打印出请求的类型、URL、method、body、timestamp 等信息。

1
2
3
4
5
6
7
8
9
10
11
12
13
/**
* injectBeforeAsyncSend.js
* @param {function(asynConfig)} beforeSend
*/
const injectBeforeAsyncSend = function(beforeSend) {
// 请在这里补充你的代码实现,在实现代码中请调用 beforeSend 方法进行日志打印
};

injectBeforeAsyncSend((asynConfig) => {
console.log(asynConfig);
});

export default injectBeforeAsyncSend;

测试用例:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
// 引入任意想使用的前端异步请求框架
import $ from 'jquery';
import injectBeforeAsyncSend from './injectBeforeAsyncSend';

// jquery 发起 get 请求
$.get('/user');
// 打印 {"asyncType":"ajax by XMLHttpRequest","method":"GET","url":"/user","body":null,"timestamp":1522143037821}

// jquery 发起带参数 post 请求
$.ajax('/user',
{
type: 'POST',
data: { username: 'jone' }
});
// 打印 {"asyncType":"ajax by XMLHttpRequest","method":"POST","url":"/user","body":"username=jone","timestamp":1522143037828}

// jquery 发起 jsonp 请求
$.ajax('https://www.alibaba.com/user.jsonp',
{
dataType: 'jsonp'
});
// 打印 {"asyncType":"jsonp by script","method":"get","url":"https://www.alibaba.com/user.jsonp?callback=jQuery331047025307012584316_1522143037811&_=1522143037812","timestamp":1522143037832}

// fetch 请求
fetch('/user');
// 打印 {"asyncType":"ajax by XMLHttpRequest","method":"GET","url":"/user","body":null,"timestamp":1522143037838}

菜雞,沒做出來。

实现一个网页版的聊天室(类似于钉钉群),请列出关键的技术方案及要点。需求如下:

  • 高实时性、高性能
  • 你发的每条消息可以看到有多少人已读
  • 当信息中含有“@某人”时,被@的人的界面上会显示“有人@你”的提醒字样
  • 刷新页面或断网状态下,历史聊天记录不会消失

開放型試題,自認爲答得一般,就沒臉秀自己寫啥了。

0%