当前位置: 首页 > Web前端 > JavaScript

前端应届生---面试总结(金九银十,努力找工作,星光不负路人)

时间:2023-03-26 21:18:44 JavaScript

webpack中,常用的loader和插件有哪些?Loaderbabel-loaderbabel-loader基于babel来解析JavaScript文件。Babel有丰富的预设和插件,Babel的配置可以直接写在选项中,也可以写在单独的配置文件中。ts-loader是webpack提供的TypeScript加载器,打包编译Typescriptmarkdown-loadermarkdown编译器和解析器raw-loader可以将文件作为字符串导入file-loader处理文件类型的资源,比如jpg、png等图片。返回值应该是publicPathurl-loader:和file-loader类似,也是处理图片的,只是url-loader可以根据图片的大小设置不同的操作。如果图片尺寸大于指定尺寸,则将图片打包为资源,否则将图片转成base64字符串合并到js文件中。svg-sprite-loader会将引用的svg文件一个一个塞进符号中,并合并成一个大的SVG精灵。使用时,通过SVG的\传入图标id,渲染图标。最后把这个大svg放在身体里。如果未指定符号的id,则为您的文件名。style-loader通过注入\标签将CSS插入到DOM中。less-loader解析less并将其转换为cssplugin。整个目录被复制到构建目录。html-webpack-plugin的基本功能是生成html文件clean-webpack-plugin默认情况下,该插件会在每次rebuild成功后删除webpackoutput.path中的所有文件,以及所有未使用的资源。mini-css-extract-plugin这个插件会将CSS提取到单独的文件中,为每个包含CSS的JS文件创建一个CSS文件。webpack.HotModuleReplacementPlugin模块热替换插件,也称为HMR。webpack.DefinePlugin创建一个可以在编译时配置的全局常量。这对于允许开发和生产构建之间的不同行为很有用。webpack-bundle-analyzer可以看到项目各个模块的大小,可以根据需要进行优化。一个用于webpack的bundle文件分析工具,它以交互式可缩放树图的形式显示bundle文件。SplitChunksPlugin代码拆分。注:来自博主博客——吐血整理的webpack入门知识和常用loader、插件栈?在数据结构中,栈中数据的访问方式是先进后出。堆是一个优先级队列,按照优先级排序。可以根据大小指定优先级。访问方法是先进先出。什么是事件循环?EventLoop即事件循环,指的是一种浏览器或Node机制,解决javaScript单线程运行时的非阻塞问题,也就是我们经常使用的异步原理。所有的任务都可以分为同步任务和异步任务。同步任务,顾名思义,就是立即执行的任务。同步任务一般直接进入主线程执行;异步任务就是异步执行的任务,比如ajax网络请求,setTimeout定时函数等都是异步任务,异步任务会通过任务队列(EventQueue)的机制进行协调。同步和异步任务进入不同的执行环境,同步进入主线程,即主执行栈,异步进入EventQueue。主线程中的任务执行完后为空,会去EventQueue中读取相应的任务推入主线程中执行。以上过程的不断重复就是我们所说的事件循环。render函数render函数就是渲染函数,它是一个函数,它的参数也是一个函数——也就是createElement,我们重点说说createElement参数。渲染函数(VNode)的返回值VNode(即:虚拟节点),也就是我们要渲染的节点。render函数的参数(createElement)createElement是render函数的参数,它本身就是一个函数,有3个参数。createElement函数的返回值(VNode)createElement函数的返回值是VNode(即:虚拟节点)。createElement函数的参数(三个)一串HTML标记、一个组件选项对象或一个解析为上述任何一个的async异步函数。类型:{字符串|对象|功能}。必需的。包含与模板相关的属性的数据对象。您可以在模板中使用这些属性。类型:{对象}。选修的。通过createElement()构造的子虚拟节点(VNodes),也可以使用字符串生成“文本虚拟节点”。类型:{字符串|数组}。选修的。注:从本博主的博客——终于看懂vue的render功能(一)-_-|||hash模式和history模式有什么区别?使用history需要注意哪些问题?1.hash模式下,请求中只会包含hash符号前的内容,比如http://www.abc.com所以对于后端来说,即使路由没有完全覆盖,也不会返回404错误;哈希设置的新值必须与原始值不同才能触发将记录添加到堆栈的操作。hash只能修改#后面的部分,所以只能设置与当前URL相同文档的URL。hash只能添加短字符串。2.history模式下,前端的url必须和后端实际请求的url一致,比如http://www.abc.com/book/id。如果后端缺少/book/id的路由,将返回404错误。(这是需要注意的问题之一)使用了HTML5HistoryInterface中新的pushState()和replaceState()方法。(需要特定浏览器支持)这两个方法应用于浏览器的历史栈。这两个方法在已有的back()、forward()、go()方法的基础上,提供了对历史Documents进行修改的功能。这两个方法进行修改时,只能修改当前地址栏的URL,浏览器不会向后台发送请求,也不会触发popstate事件的执行。...为什么axios需要二次包装?如何实现?为了减少代码量,方便我们更好的管理自己的接口,以免在请求的接口很多的时候造成混乱。axios二次打包示例1.新建api文件夹,用于集中管理requests2.在api文件夹下创建对应的功能模块文件3.在文件中导入打包好的request函数4.代码示例如下import{request}from'../service/request'exportfunctionfetchData(data){returnrequest({//详细配置请参考axios官方文档http://axios-js.com/zh-cn/docs/method:'get',url:'/get',params:data})}注:来自博主的博客---面试官:为什么需要axios的二次包装,有什么用?常见状态码200:“服务器成功返回请求的数据。”,201:“创建或修改数据成功。”,202:“请求已进入后台队列(异步任务)。”,204:“删除数据成功.",400:"发送的请求有错误,服务器没有创建或修改数据。",401:"用户没有权限(token、用户名、密码错误)。",403:"没有访问权限",404:"发送的请求服务器没有对不存在的记录执行任何操作。",405:"请求行中指定的请求方法不能用于请求相应的资源。",406:“请求的格式不可用。”,410:“请求的资源已永久删除,将不再可用。”,422:“创建对象时发生验证错误。”,500:“An服务器出错,请检查服务器。",502:"网关错误。",503:"服务不可用,服务器暂时结束已加载或正在维护中。”,504:“网关超时。",六、vue如何自定义指令?使用指令的几种方式://会实例化一条指令,但是这条指令没有参数`v-xxx`//--传值给指令`v-xxx="value"`//--将字符串传递给命令,例如`v-html="'

content

'"``v-xxx="'string'"`//--传递参数(`arg`),例如`v-bind:class="className"``v-xxx:arg="value"`//--使用修饰符(`modifier`)`v-xxx:arg.modifier="value"`例如,输入框自动获得焦点://注册一个全局自定义指令`v-focus`Vue.directive('focus',{//当绑定的元素插入DOM时inserted:function(el){//焦点元素el.focus()}})//注:来自博主的博客---如何在vue中自定义指令七、Linux常用命令登录和注销1)sudouseraddlilei//添加用户(不能立即使用,需要设置密码sudopasswdlilei)2)sudoadduserlilei//添加用户3)login//登录或切换用户4)logout//logoutuser(commandline)exit(shell-exitconsole)5)shutdown-h10//10分钟后自动关机shutdown-c//cancel6)halt(rootuser)//关闭所有进程后自动关机7)poweroff//同上8)shutdown-r10//十分钟后自动重启9)init6//重启(0-关机,1-单用户,2-多用户,3-满多用户,4-图形,5-安全模式,6-reboot)10)reboot//重启目录和文件1)pwd//显示当前工作目录2)mkdirmydir//创建工作目录3)cdmydir//更改工作目录4)rmdirmydir//删除工作目录5)touchmyfile//创建文件6)mvmyfilemydir//移动目录或文件7)cpmyfilemyfir//复制目录或文件8)rm-rfmydir//删除目录或文件9)ls-lmyfile//查看文件的最后编辑时间10)ls-lumyfile//查看文件的最后访问时间11)touch-at01011212myfile//修改文件最后访问时间12)ls//列出所有文件和目录13)ls-a//查看所有文件14)ls-i//显示文件索引节点号15)ls-l//详细显示16)ls-m//用逗号分隔17)sudoapt-getinstalltr??ee18)tree-l//在树视图中列出目录内容19)tree-a//all20)tree-i//noStepwise21)tree-s//列出文件或目录的大小22)tree-t//根据变化时间23)file-bmyfile//显示目录或文件的详细信息24)statmyfile//同上文件内容显示1)cat>myfile//创建文件并编辑内容(ctrl+D结束编辑)2)cat-nmyfile//查看文件3)chmod[u/g/o/a][+/-/=][r/w/x]myfile//更改文件权限u-user,g-group,o-others,a-all.+-add,--delete,=-reset.r-readread(4),w-writewrite(2),x-executeexecute(1)4)moremyfile//分页后显示文件(空格space)5)lessmyfile//分页自由显示文件(PageDown/PageUp)6)head(-10)myfile//指定显示文件前几行(默认Top10)7)tail(-10)myfile//指定显示文件后的行数(默认最后10)文件内容处理1)sortmyfile//对文件内容进行排序2)sort-rmyfile//倒序3)uniqmyfile//检查文件中的重复内容4)grep(-c)'a'myfile//查找文件中的指定内容(显示行号)5)diffmyfile01myfile02//比较不同的文件6)diff3myfile01myfile02myfile03//三个文件7)sdiffmyfile01myfile02//合并8)cmpmyfile01myfile02//按字节比较不同文件9)commmyfile01myfile02//比较有序文件10)cut-b(-c)(-d)2(3)myfile//剪切文件内容11)pastemyfile02myfile01//粘贴文件内容02-)0112)wc(-参数)myfile//计算文件内容(c-字符数,w-数字字数,l-行数)压缩1)zipmyfile.zipmyfile//压缩2)zip-dmyfile.zipmyfile//添加3)zip-mmyfile.zipmyfile//删除4)unzip-omyfile.zip//解压(覆盖)5)unzip-nmyfile.zip//解压(不要覆盖)6)zipinfomyfile.zip//列出压缩文件信息以获得帮助1)manls//获得帮助2)man-kls//我不知道全名3)whatisls//获取帮助4)helpcd/cd–help//获取帮助-d(简短描述)-s(使用介绍)5)infowho//获取帮助其他命令1)clear//清除屏幕信息2)echoxx//显示文本x=0echo$x。回声-e\$x。echo$(pwd)3)date//显示日期时间(+%y年+%m月+%d日)4)cal//显示当前日期cal-y5)ps//查看当前进程-A(all)Ulilei(userlilei)6)kill-92315//终止一个进程7)ps-ef|grepJincheng8)pkillJincheng9)killallJincheng10)last//显示最近登录系统用户信息-6列11)history(10)//显示历史命令-默认1000行12)sudoadduserlileisudo//给普通用户root权限13)sudousermod-Gsudolilei//同上14)aliasl='ls'//定义命令别名15)unaliasl//删除别名16)alias//列出别名...