webpack（1）

最新推荐文章于 2023-05-11 00:50:59 发布

weixin_33729196

最新推荐文章于 2023-05-11 00:50:59 发布

阅读量133

点赞数

CC 4.0 BY-SA版权

文章标签： webpack javascript 面试 ViewUI

原文链接：https://segmentfault.com/a/1190000017046868

前言：

（1）拥有一套自己的MD风格的编辑体系
（2）大标题使用中文汉字顺序排列
（3）二级标题使用小括号
（4）三级标题使用小数打点的方式
（5）四级标题直接打点
（6）使用tab键进行缩进
（7）思否这个编辑器的一个tab键相当于四个空格，思否markdown编辑器四个空格才可以生效 
 果
（8）如果发生了换行的情况，第二行的第一个汉字就必须与序号进行对齐
（9）在代码行与文本行之间需要添加换行（也就是enter键），否则会出现BUG

一、了解webpack是什么？（摘选官方手册https://www.webpackjs.com/gui...）

（1）本质上是一个现代的javascript应用程序的静态模块打包器；（详情参考官网）
（2）了解其中四大基本概念；
    1、入口（entry  ）
    2、输出（output ）
    3、加载（loader ）
    4、插件（plugins）

二、直接上手（怎样使用webpack）

（1）安装webpack
    1、安装前提：
        node v（版本）8.11.3 或其他
        npm  v（版本）6.4.1  或其他

三、面试经历总结（2018/11/23）地点：南山深大地铁站公司名称：未来科技

（1）两个函数的编写
     1、结果缓存（类似vue的watch的属性）
         -实现机制如下图代码所示

//实现一个缓存系统
//定义数组
var arr = [
    {"id":"111","uname":"tmo"},
    {"id":"222","uname":"jack"},
    {"id":"333"."uname":"john"}
]
//定义函数
function find(){
    
}
//定义缓存函数
function memorise(){}
//匿名函数自调
(function(){

})()

     2、函数去抖
         -实现的机制如下图所示

//完成函数去抖的功能

（2）小程序开发
    1、
    2、
    3、
（3）垂直水平居中（display:flex）
    1、转换
        -transform:
    2、绝对定位
        -position:absolute
    3、弹性布局
        -display:flex;justify-content:center;align-items:center
（4）base64
（5）处理轮播图
（6）图片处理 H5利用缓存cache
（7）小程序对图片的处理
（8）浏览器的缓存机制以及执行过程