猫眼 校园招聘_1面

(1)打包和构建工具 vite 和 webpack 功能

1. 构建原理:

Webpack 是一个静态模块打包器,通过对项目中的JavaScript、css、Image 等文件进行分析,生成对应的静态资源,并且通过一些插件和加载器来实现各种功能。

Vite 是一种基于浏览器元素 ES 模块解析构建工具,它通过在服务器端搭建开发环境,在浏览器中使用原生ES模块的方式实现快速开发体验。

  • Webpack 支持各种复杂的构建场景,例如 代码分隔、按需加载等,但也因此导致配置复杂,打包速度较慢。
  • Vite 支持快速的开发反应和打包速度快,但是在复杂的构建场景下可能会收到限制。

2. 打包速度:

Webpack 的打包速度相对较慢,在大型项目中,需要对整个项目进行扫描和分析,还需要通过插件和加载器来实现各种功能,隐藏构建时间往往比较长。

Vite 的打包速度非常快,不需要对整个项目进行扫描和分析,而是通过服务器端搭建的开发环境,在浏览器中使用原生ES模块的方式加载文件,因此构建时间比webpack快数倍。

3. 配置难度

Webpack 有大量的插件和加载器可以使用,可以实现各种复杂的构建场景,比如代码分隔、按需加载、CSS预处理器等。

Vite 的插件和加载器相对较少,但提供了一些基本插件,例如:Vue.js、React 等框架支持。

(2)ES6 怎么转成 ES5

babel

(3)资源优化

项 目

(1)登录流程

(2)token放在什么地方,access是不是nodejs执行的?

nodejs

(1)导入导出的方式?导出是exports和module.exports,导出是require。其中默认是module.exports导出,exports只是对module.exports的引用
(2)ES6的导入导出方式?导出是export和export default,导入是import。其中export default一个文件只能有一个,export导出的需要通过{}导入
(3)nodejs怎么执行es6?配置文件加上"type:module"

webpack

(1)webpack打包流程
(2)webapck优化方案
(3) 图片怎么实现打包优化
(4)配置文件中的版本控制介绍
(5)怎么实现固定版本控制

js

(1) js事件流:捕获阶段、目标阶段和冒泡阶段
(2)为什么冒泡?冒泡有什么好处?

(3)事件代理: 允许将事件处理器绑定到一个元素的共同的父元素上,而不是直接在每个子元素上绑定事件处理器。当子元素触发事件时,事件会冒泡到父元素,然后在父元素上被捕获并处理。这样可以减少事件处理器的数量,提高性能,特别是当有大量子元素需要绑定事件时。

  • 步骤:
  • 找到一个共同的父元素,通常是包含了所有需要处理事件的元素的容器。
  • 在共同的父元素上绑定一个事件处理器,处理你关心的事件。
  • 在事件处理器中,使用事件对象的属性来确定是哪个子元素触发了事件,然后执行相应的操作。
  • 事件委托是事件代理的实际机制。它利用了事件冒泡的特性,即事件会从触发元素向上冒泡到根元素
(4)哪个属性查看触发事件的元素?event.target
(5)原型链?隐式原型和显式原型
(6)回流和重绘
(7)怎么减少回流(重绘)

(8) 数据静态
(9)防抖和节流
(10)事件轮询和事件循环?同步任务和任务队列
(11)async和await的错误怎么获取?try catch

git

(11)git的基本使用

(12)git出现冲突

浏览器

(13)http状态码

(14)304一般用在什么地方?缓存

手撕:

(15)js链表
javascript 复制代码
var valid = function(s) {
    const stack = [];
    for (let i = 0; i < s.length; i++) {
        let c = s[i];
        switch (c) {
            case '(':
                stack.push(')');
                break;
            case '[':
                stack.push(']');
                break;
            case '{':
                stack.push('}');
                break;
            default:
                if(c !== stack.pop()) {
                    return false;
            }
        }
    }
    return stack.length === 0;
};
(16)括号匹配
相关推荐
学习使我快乐012 小时前
JS进阶 3——深入面向对象、原型
开发语言·前端·javascript
bobostudio19952 小时前
TypeScript 设计模式之【策略模式】
前端·javascript·设计模式·typescript·策略模式
黄尚圈圈3 小时前
Vue 中引入 ECharts 的详细步骤与示例
前端·vue.js·echarts
浮华似水4 小时前
简洁之道 - React Hook Form
前端
正小安6 小时前
如何在微信小程序中实现分包加载和预下载
前端·微信小程序·小程序
_.Switch7 小时前
Python Web 应用中的 API 网关集成与优化
开发语言·前端·后端·python·架构·log4j
一路向前的月光7 小时前
Vue2中的监听和计算属性的区别
前端·javascript·vue.js
长路 ㅤ   7 小时前
vite学习教程06、vite.config.js配置
前端·vite配置·端口设置·本地开发
长路 ㅤ   7 小时前
vue-live2d看板娘集成方案设计使用教程
前端·javascript·vue.js·live2d
Fan_web7 小时前
jQuery——事件委托
开发语言·前端·javascript·css·jquery