- 博客(79)
- 收藏
- 关注
RSS订阅原创 webpack学习笔记（2）——plugins及loaders应用
在webpack的应用中，提供了众多的plugins和loaders方便了我们项目的构建和打包。下面分别通过具体的例子展示plugins和loaders的使用方式：1.html-webpack-plugin自动化生成项目中的HTML页面：首先在项目目录下安装html-webpack-plugin插件：cnpm install --save-dev html-webpack-plugin...
2020-05-04 18:43:49
326
原创 Windows系统中npm install时遇到npm WARN checkPermissions Missing write access to问题
问题：在使用webpack的html-webpack-plugin插件时，首先需要安装该插件，然而我的安装过程总是报错不成功，报错如下：分析原因：看报错信息应该是权限的问题，网上也有说是因为node版本的问题，需要升级。有确定答案的大神，麻烦指导。解决办法：在我一筹莫展的时候，误打误撞用了淘宝镜像cnpm安装，然后成功了，还是有些许困惑，期待有大神答疑解惑。...
2020-05-04 11:11:59
639
原创 webpack学习笔记（1）——初识webpack
1.webpack的作用：webpack是一个前端项目构建和打包的工具，可以实现js、css、图片的压缩和合并，是一款现代js引用程序的静态模块打包器。当webpack处理应用程序时，它会递归地构建一个依赖图，其中包含应用程序需要的每个模块，然后将所有这些模块打包到一个或多个包中。构建:就是将源代码转换成发布线上可执行的js,css,html代码构建的过程包含:代码转换:TypeScri...
2020-05-02 18:32:51
395
原创 jQuery插件之图片预加载
背景：图片是web页面的重要组成部分，也是前端页面优化的重要内容。当用户访问一个比较庞大的页面时，若相关资源没有提前加载，可能会展示给用户一片空白，从而导致用户流失等；再比如受网速的影响，资源加载时间较长，可能使得页面出现错乱等问题。因此预加载就显得很有必要，同时预先加载的页面可以在用户需要时，直接从本地缓存中渲染，减少用户的等待时长。图片优化--------预先加载； 提升用户体验效果...
2020-04-21 21:58:40
410
原创 海康威视前端面试
海康威视前端面试：1.自我介绍2.js中如何实现继承3.面向对象的语言的特征4.前端如何实现封装，如何封装一个类，包含私有特性和公有特性（以兵马俑为例）5.如何确定数据类型6.事件执行顺序，事件委托的设计模式7.如何优化一个图片的加载8.方法重载和重写的区别，前端怎么实现类似的方法重载（arguments对象）9.学校里学过什么语言，C和JAVA和js的区别...
2020-04-20 19:31:25
5246
2
原创 阿里前端面试
和面试官提前预约好时间，等了有半个小时吧，面试官说比较忙，线上出了一些题目，半个小时作答，然后针对题目交流了有半个多小时吧，后续还问了意向工作地点、介意换工作地等相关问题。下面是题目：1、行内元素、行内块元素、块级元素分别有哪些标签？分别列举3个以上（越多越好）。行内元素: span a b br行内块元素: img input块级元素:p div h1-h62、定位方式有几...
2020-04-20 19:24:34
455
原创 小米和亚控前端面试
在闲暇之余，整理一下去年秋招参加的几场还能回忆起来的相关公司的前端面试题（2020届）。小米一面:1.介绍一个前端相关的项目；2.熟悉什么框架？vue的双向数据绑定的实现原理，viewmodel，view，model，this赋值给谁了？3.线上写代码：CSS实现一个等边三角形；4.线上写代码：js实现寻找两个字符串的最大公有子串；5.new一个对象的过程，this亚控...
2020-04-20 19:12:39
309
原创 消除img标签中图片底部的间隙
问题：在一个包含容器中（如div、p等标签中）放置一张图片，图片底部与容器底部会出现一些间隙，如下图在Chrome浏览器中有4px的间隙，why？原因：这是因为图片在容器中是通过基线（baseline）对其的，如果我们在图片后面添加一些文本，就可以很容易发现图片底部和文本基线对其。解决方案：1.设置img{display: block;}，即将img标签设置为块状元...
2020-04-18 17:48:50
479
原创 详解ES6新增的数组方法
之前有汇总js中数组的属性和常用方法，链接地址为：https://blog.csdn.net/Freya_yyy/article/details/84780003，同时有对js中Array map()与forEach()的用法进行了对比，链接地址为：https://blog.csdn.net/Freya_yyy/article/details/81637169。下面详细介绍一下ES6新增的部分...
2019-09-14 17:04:26
511
原创 【转】Java实现一个加法计数器，要求满足任意大小两个整数相加
题目：请实现一个加法计数器，要求满足任意大小两个整数相加解析：答案转自网上大神，找不见链接了。答案是进阶版，对于任意多个整数相加的结果import java.util.Scanner;public class twoNumAdd { public static void main(String[] args) { Scanner input = new Scanner...
2019-09-12 16:52:54
1158
1
原创 笔试题之利用Promise改变异步函数的执行顺序
海康威视前端笔试题：题目一：利用Promise改变异步函数的执行顺序，原代码如下所示，修改原代码，使得先输出“b”，再输出“a”function a(){ setTimeout(function(){ console.log("a"); }, 1000)}function b(){ setTimeout(function(){ ...
2019-09-09 11:29:53
922
原创 cookie、session以及HTML5的本地存储
浏览器的缓存机制提供了可以将用户的数据存储在客户端上的方式，可以利用cookie，session等跟服务器端进行数据的交互。cookie和session：cookie和session都是用来跟踪浏览器用户身份的会话方式，其区别如下：1、保持状态：cookie保存在浏览器端，session保存在服务器端2、使用机制：（1）cookie机制：如果不在浏览器中设置过期时间，cooki...
2019-08-31 16:59:04
324
原创 阿里前端笔试题之类似实现杨辉三角
杨辉三角如图所示：题目：阿里前端笔试题中有一个编程题类似于杨辉三角，只是每行数字的元素均为1。实现思路：可以使用二维数组实现杨辉三角。其中每一行都是一个内层数组。在输出的时候再将每一个内层数组用join()方法通过空格来分割元素并转换成字符串来输出，这样看起来就比较美观。要想第一行居中，就根据所要输出的行数来给每一个内层数组前面添加空格。而且要考虑行数越多，下面的每一个数字的长...
2019-08-28 21:59:03
632
原创 CSS实现元素水平居中、垂直居中、水平垂直居中
1.元素水平居中1.1行内元素水平居中像文本text、图像img、按钮等行内元素要实现水平居中，只需要给父元素设置text-align:center;即可。.center{ text-align:center;}<div class="center">文本水平居中</div>1.2块级元素水平居中定宽块级元素的水平居中：方法1：给...
2019-08-19 18:56:38
584
1
原创 js经典题相关知识点总结（call、apply、bind、arguments、创建对象、乘法）
1.题目描述：将函数 fn 的执行上下文改为 obj 对象解析：在js中，函数也是对象，它的上下文是可以改变的，函数内的this也是可以变化的，this是在执行时确定的，不是定义时确定的。函数可以作为一个对象的方法，也可以同时作为另一个对象的方法，可以通过Function.prototype属性上的call()方法、apply()方法和bind()方法改变函数的上下文，函数中的this指向...
2019-08-16 16:03:29
189
原创 网易前端笔试题
部分前端笔试题，仅供参考：1．<canvas width="250" height="250"></canvas>有个矩形长20px，高10px,CSS中width：250px height：500px，请问这个矩形渲染出来的实际面积（A）？A.400 B.200 C.300 ...
2019-08-07 18:31:41
885
原创 h5新增元素之canvas渲染问题
笔试题中遇到canvas元素渲染的问题，平时不太使用canvas元素，有些疑惑，总结一二。<canvas>是HTML5新增的，可以通过脚本（通常为javascript）在其中绘制图像的HTML元素。<canvas>元素本身没有绘制能力，它仅仅是一个图形容器，必须使用脚本来完成绘图任务，它就像我们画画的画布一样，需要人来用画笔完成画作。1.canvas基本使用：...
2019-08-05 11:06:28
688
原创 Java实现字符串压缩即统计连续出现的字符，输出一个新的字符串
题目一：给定一个字符串，统计连续字符的个数，输出一个新的字符串。eg：abbbccd，输出：a1b3c2d1解题：public class stringTest { public static String func(String str){ StringBuffer result = new StringBuffer(); if(str.len...
2019-07-26 17:47:31
1147
原创 编译型语言与解释型语言
我们平时运用各种编程语言编写的程序，对于计算机来说是无法直接理解的。因此在执行前，计算机需要一个"翻译"，即把程序代码变成计算机可以理解的语言：0和1组成的包含信息的序列。目前存在两中翻译类型：编译和解释。编译型语言VS解释型语言概述：编译型语言：将源代码编译成可执行的二进制代码。则编译型语言编写的程序在编译后可直接运行。 解释型语言：源程序在执行前需要在环境中安装解释器，专门的...
2019-07-25 11:55:51
259
转载 notepad++ 、notepad快捷键大全
原文链接：https://blog.csdn.net/huo_chai_gun/article/details/41826401Notepad++绝对是windows下进行程序编辑的神器之一，要更快速的使用以媲美VIM，必须灵活掌握它的快捷键，下面对notepad++默认的快捷键做个整理（其中有颜色的为常用招数）：1. 文件相关2.编辑相关建议添加一个快捷键用来复制当...
2019-05-10 17:58:09
804
原创 ftp-server进程健康检查脚本总结
实现FTP-Server进程健康检查的一个shell脚本，寥寥数行代码却问题频出，在此总结一二。一．脚本书写规范：1.脚本开发时，务必在脚本的开头编写脚本解析器。note：开发人员一般采用默认的B SHELL 即#!/bin/bash ，也有采用#!/bin/sh，两者在语法上是存在一定差异的，无特殊情况下，必须强制使用#!/bin/bash。2.对变量进行引用或字符串组合时，...
2019-04-12 09:51:30
322
转载 Intellij IDEA 快捷键整理
【常规】Ctrl+Shift + Enter，语句完成 “！”，否定完成，输入表达式时按 “！”键 Ctrl+E，最近的文件 Ctrl+Shift+E，最近更改的文件 Shift+Click，可以关闭文件 Ctrl+[OR ]，可以跑到大括号的开头与结尾 Ctrl+F12，可以显示当前文件的结构 Ctrl+F7，可以查询当前元素在当前文件中的引用，然后按 F3 可以选择 Ct...
2019-04-11 11:15:19
137
原创 正则表达式用法汇总
正则表达式：使用单个字符串来描述或匹配一系列符合某个句法规则的字符串。在很多文本编辑器或其他的工具里，正则表达式通常用来检索和替换那些符合某个模式的文本内容。在对Linux系统进行管理时，我们有很多工具 支持正则表达式的匹配方法，常用的工具有grep、sed、awk等。基本要素：字符类、数字限定符、位置限定符grep是Linux下按行匹配文本的工具，其采用贪婪模式，即为匹配当前行中的所有的匹...
2019-04-04 20:05:13
221
原创 linux之grep、sed、awk工具的使用
Linux实现一些命令可以调取相关工具实现对文本的精准查找和匹配，常用的有grep、sed、awk等命令可以调取相应的工具。其中grep、sed、awk都是针对文本的行进行操作的。1.grep命令命令功能：是一种强大的文本搜索工具，能使用正则表达式搜索文本，然后把匹配的行显示出来。命令格式：grep [-cinvABC] ‘word’ filename参数说明： -...
2019-03-28 11:35:39
254
原创 linux内置编辑器vi/vim的用法
在Linux中使用vi filename，可以查看相应的文件内容并进行修改及保存。原来是所有的 Unix Like 系统都会内建 vi 文书编辑器，其他的文书编辑器则不一定会存在。而vim是从 vi 发展出来的一个文本编辑器。代码补完、编译及错误跳转等方便编程的功能特别丰富，在程序员中被广泛使用。vi 是老式的字处理器，不过功能也很齐全了，但是还是有可以进步的地方。 vim 则可以说是程序开发者的...
2019-03-14 20:20:13
1007
原创 linux命令之chmod
Linux/Unix 的文件调用权限分为三级 : 文件拥有者、群组、其他。利用 chmod 可以控制文件如何被他人所调用。使用权限: 所有使用者语法chmod [-cfvR] [--help] [--version] mode file...参数说明mode : 权限设定字串，格式如下 :[ugoa...][[+-=][rwxX]...][,...]其中：u ...
2019-03-10 16:04:08
213
原创 linux命令之chown
问题：在修改服务器上的一个文件时，由于上传文件的使用者错误导致修改不成功。解决方案：随后使用Linux命令里的chown命令解决了问题。后来还专门查了一下这个英文单词的意思，字典解释为“修改文件目录属主”。正如字典解释的，使用 chown命令可以将指定文件的拥有者改为指定的用户或组，用户可以是用户名或者用户ID；组可以是组名或者组ID；文件是以空格分开的要改变权限的文件列表，支持通配符。...
2019-03-10 11:43:21
434
原创 linux命令之rmdir,rm,mv
1.Linux的rmdir命令：命令功能：rmdir用于删除空的目录。（非空目录的删除使用rm命令，详情见下） 语法：rmdir [-p] dirName 参数：-p是当子目录被删除后其上层目录成为空目录的话，则一并删除上层目录。 示例如上图命令，删除demo目录下的空目录test，由于添加了[-p]，当test目录也为空时，会将test目录一并删除。2.Linuxd...
2019-03-06 21:17:07
357
原创 华为笔试题之nodejs实现日期时间的格式化
华为笔试题如下：题目描述：实现一段程序，输入一个自EPOC开始已经经过的时间（秒），按照自定义格式输出对应的时间。自定义格式说明（除了年份，同意格式化2位宽，不足的补0）,这里注意区分%HH24小时制（00-23）和%hh12小时制（01-12）输入描述：首行为秒数；第二行为输出格式输出秒数：经过计算和格式化后的时间note：a.需要注意输入的时间单位为秒，需要化为毫秒级别...
2019-01-21 16:48:00
2568
原创 jQuery实现一个备忘录
使用jQuery库实现一个纯前端的备忘录，因为没有与后台数据库进行交互，所有备忘信息存储在localStorage，源码中引用了store.js插件实现。备忘录的主要功能如下：添加待完成事项； 待完成事项信息的修改、删除、详情展示及相关备注； 实现事项的完成状态； 待完成事项的提醒功能； 原生js实现弹框。1.主页面的布局结构如下，其中 页面中的待完成事项的模板渲染、待完成事项的...
2019-01-13 22:06:25
1407
原创 jQuery中报错：$(...).play is not a function
问题：使用jQuery库制作一个记事本时，使用audio标签设置提示音时报错显示$(...).play is not a function原因：<audio class="alert" src="alert.mp3">这是一个播放器</audio>var $alerter = $('.alert'); $alerter得到一个jQuery对象，j...
2019-01-13 18:08:05
5275
原创 踩坑git提交中的冲突解决
写在前面：之前使用git工具整理代码时，太粗心大意了，踩了不少坑。在此想说我们遇到问题不要慌，其实认真看error、hint、fatal基本都能解决哒。还有轻易莫rm，否则追悔莫及呀~~~~~~会持续踩坑，持续更新这篇博客~~~~~~一.git pull线上代码时出现error： You have not concluded your merge，原因是在拉取时代码还没有合并$...
2019-01-03 21:41:25
4515
原创 git中本地库与远程库的关联及取消以及删除本地仓库
1.git中在本地目录下关联远程库git remote add origin [email protected]:git_username/repository_name.git 2.git中取消本地目录下关联的远程库删除本地文件夹下的.git 文件夹即可 有两种方式：命令删除：在要删除的仓库目录文件夹上右击“Git bash here”，打开git bash，输入删除命令：...
2019-01-02 17:54:30
5042
1
原创 js实现不同浏览器内核的style属性前缀添加
正如我之前的那篇博文CSS3之transform属性最开始所述，针对不同的浏览内核的transform有不同的书写规则，如果需要兼容各浏览器的话，所有写法都需要调用。不管是使用CSS设置DOM元素的transform属性，还是使用js实现，都不可避免的增加了代码的数量。针对一个项目中需要多次添加不同元素不同状态下的变换属性，我们可以实现一个针对不同的浏览器内核添加前缀的方法，此后只需要在不同的...
2018-12-28 15:45:31
831
转载 踩坑Vue中的 ref 和 $refs
转载整合于https://blog.csdn.net/FireBird_one/article/details/79958733和https://blog.csdn.net/sinat_17775997/article/details/73932246 如图，ref 被用来给元素或子组件注册引用信息。引用信息将会注册在父组件的 $refs 对象上。如果在普通的 DOM ...
2018-12-26 16:43:56
581
原创 有关git提交代码的相关事宜
在Git中，提交是相当重要的概念。Git管理的是软件版本，而版本库中的版本是以提交的形式保存的。1.我们可以使用git log命令来查看提交中包含的信息。如下图所示：这段信息的第一行显示的是该提交的散列值，接下来是与作者相关的信息、该提交被创建的时间以及相应的注释信息。注意：针对每次提交，Git会为其计算一个由40个字符组成的唯一的编码，即提交散列值。有了这个散列值，我们可以将项目中的...
2018-12-23 20:07:00
205
原创 实现第N个丑数的输出
丑数（Ugly Number）：我们把只包含质因子2、3、5的数称为丑数。例如4、6、10都是丑数，但是14不是丑数，因为其包含因子7。习惯上把1称为第一个丑数。题目：按照从小到大的顺序输出第N个丑数。题目分析：假设我们已经得到n个丑数，接下来要产生第n+1个丑数；则第n+1个丑数为前面某个丑数A * 2，B * 3，C * 5中的最小值。 第一个丑数为1，则第二个丑数为1*2,...
2018-12-17 17:39:43
752
原创 js实现数组扁平化的4种方法
数组的扁平化即为将一个嵌套多层的数组转换为只有一层的数组。其核心思想即为遍历数组arr，若arr[i]为数组则递归遍历，直至arr[i]不为数组然后与之前的结果concat。[1, 3, [5, 2], [2, 3, [4, 5]]]------->[1, 3, 5, 2, 2, 3, 4, 5]下面直接上代码：/*实现一：递归*/function flatArray(...
2018-12-10 15:54:48
5894
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人