网易前端面试(灵犀部门)

45,022

更多面试记录,查看我的专栏--面试记录

往期内容:

字节前端面试(广告部门)

字节pico前端面试

高途前端面试

一面

时间:20220214
状态:未知(估计不过吧)
灵犀部门从网上查到的资料业务主要是协同办公

自我介绍

TS部分

虽然,我简历上写了typescript,但是前面面之中都没有遇到问我ts的,所以前面复习的也差不多忘了
typescript基础使用
typesctipt面试题

ts在项目中如何运用的

省略

type 和 interface的区别

  1. type类型别名,可以定义基础类型,元组等
  2. type不会创建一个真正的新的类名
  3. 类型别名无法被实现implements,而接口可以被派生类实现
  4. 类型别名重名会抛出错误,接口重名是会产生合并 type与interface的区别

enum常规枚举和常量枚举的区别

常量枚举在编译以后不会产生一个枚举对象
常规枚举和常量枚举的区别

void定义的变量类型

void:没有任何类型。例如:一个函数没有返回值,那么返回值可以定义为void。

vue

watch和computed的区分

watch

  • 作用监听数据的变化,支持监听普通数据类型和引用数据类型(如果需要监听对象属性变化,需要搭配deep:true使用),也只是监听对象某个属性的变化。
  • 不支持缓存,当数据变化时,会出发watch中的内容

computed

  • 作用根据一些数据计算成一个新的值,支持缓存,依赖的值不发生变化,对其取值时计算属性方法不会重复执行
  • 不支持异步,当computed内有异步操作时无效,无法监听数据的变化

http相关的知识

  • HTTP/0.9 - 单行协议
    HTTP于1990年问世,那时候HTTP非常简单:只支持GET方法;没有首部;只能获取纯文本。

  • HTTP/1.0 - 搭建协议的框架
    1996年,HTTP正式被作为标准公布,版本为HTTP/1.0。1.0版本增加了首部、状态码、权限、缓存、长连接(默认短连接)等规范,可以说搭建了协议的基本框架。

  • HTTP/1.1 - 进一步完善
    1997年,1.1版本接踵而至。1.1版本的重大改进在于默认长连接;强制客户端提供Host首部;管线化;Cache-Control、ETag等缓存的相关扩展。

  • HTTP/2.0

http1.1 和 htpp2.0的区别

HTTP/2 相比 1.0 有哪些重大改进?

项目中从http角度做的优化

http中最大并发数量

image.png

webpack 和 gulp的区别

gulpwebpack
定位强调的是规范前端开发的流程是一个前端模块化方案
目标自动化和优化开发工作流,为通用website开发而生通用模块打包加载器,为移动端大型SPA应用而生
学习难度易于学习,易于使用,api总共只有5个方法有大量新的概念和api,有详尽的官方文档
使用场景基于流的作用方式合适多页面应用开发一切皆模块的特点适合单页面应用开发
作业方式对输入(gulp.src)的js,ts,scss,less等资源文件进行打包(bundle)、编译(compile)、压缩、重命名等处理后(guld.dest)到指定目录中去,为了构建而打包对入口文件(entry)递归解析生成依赖关系图,然后将所有以来打包在一起,在打包之前将所有依赖转译成可打包的js模块,为了打包而构建
使用方式常规js开发,编写一些列构建任务(task)编辑各种JSON配置
有点适合多页面开发,易于学习,易于使用,接口优雅可以打包一切资源,适配各种模块系统
缺点在大页面应用方面输出乏力,而且对流行的大页面技术有些难以处理(比如vue但文件组织,使用gulp处理就会很困难,而webpack一个loader就能轻松搞定)不适合多页应用开发,灵活度高但同时配置很繁琐复杂,"打包一切"这个优点对于HTTP1.1尤其重要,因为所有资源打包在一起能明显减少浏览器访问页面时的请求数量,从而减少应用程序必须等待的时间。但这个有点可能会随着HTTP/2的流行而变得不那么突出,因为HTTP/2的多路复用可以有效解决客服端并行请求的瓶颈问题。
结论浏览器多页应用(MPA)首选方案浏览器单页应用(SPA)首选方案

详细解答webpack 和 gulp的区别

手写题

字符串是有括号组成,判断内容是否为有效内容

'()' // true
‘({})’ // true
'[()' // false
'[(])' // false

方法一: 通过数组的压栈出栈的方式

function brackets(str) {
    const arr = [];
    const map = {
        '{': '}',
        '[': ']',
        '(': ')'
    }
    for(let i = 0, l = str.length; i < l; i++) {
        let s = str[i];
        if(map[s]) {
            arr.push(s);
        }
        else if(map[arr.at(-1)] === s) {
            arr.pop();
        }
        
        // 不满足出栈也不满足出栈时,表示不合法
        else {
            return false;
        }
    }
    return arr.length === 0;
}

方法二: 字符串中心扩散的方式

function brackets1(str) {
    const map = {
        '{': '}',
        '[': ']',
        '(': ')'
    }
    let tempStr = str;
    for(let i = 0; i < tempStr.length;) {
        let s = tempStr[i];
        let next = tempStr[i + 1];
        if(map[s] === next) {
            tempStr = tempStr.slice(0, i) + tempStr.slice(i + 2);
            i = i > 0 ? i - 1 : 0;
        }
        else {
            i++;
        }
    }
    return tempStr.length === 0;
}