- 博客(19)
- 收藏
- 关注
RSS订阅原创 从一道“微信面试题”能学到什么？
关于题目的说明为什么取得是这样的一个题目，这个其实不难理解，作为BAT中的一员，tx的面试题往往会成为一段时间之内的某些领域的风向标。这些面试题可能并不难，但是涵盖了很多方面的知识，需要我们谨慎应对。题目内容：实现一个LazyMan，按照下面的方式进行调用，得到相关输出：LazyMan("mulige")// Hi! This is mulige!LazyMan("mulig...
2019-11-14 15:20:55
258
原创 setTimeout
我们从下面的一个例子引出本次的问题：const t1 = new Date();setTimeout(() => { const t3 = new Date(); console.log('setTimeout block') console.log('t3 - t1=', t3-t1)}, 100);let t2 = new Date();whil...
2019-08-01 15:34:48
887
原创 VUE递归组件实现一个简单的树形结构
关于什么情况下使用以及里面使用的部分原理在本文就不做说明了，现在介绍的只是简单的一种实现的方式；先看下实现的效果：简单介绍下这个组件的功能：1. 显示是否存在下级菜单的左侧按钮提示2. 展开的时候的左侧按钮的展示状态的改变3. 选中的时候文字的颜色的变化4. 点击文字选中的时候会返回当前的这个位置的内容（可根据自己需求进行修改）先看下父组件的代码：&l...
2019-03-06 14:30:57
3995
6
原创 一个简单的VUE选择城市组件
首先看下效果： ps： 请忽略上面的水印该组件基于vue + iview搭建而成，可以根据需求自行修改，接下来就是组件的整体的说明了；一、目录结构这是一个常规的VUE的目录的结构，我们使用的文件就是图片中的用圈标注的文件；二、文件介绍1. chooseCity.vue这个文件就是我们的使用的最核心的文件，关于这个选择城市的三级联动的相关处理都在这个文件中进行。...
2019-01-02 11:14:39
9752
4
原创 行内元素在竖直方向的margin，以及padding的使用问题
margin，和padding这两个属性是我们在进行页面的布局常用的俩个属性，也是盒模型计算的重要的参数。那么这两个属性在行内元素上使用的时候实际上和块级元素以及行内块是有区别的，看一下下面的示例：首先是代码：<div> <span>这是一个行内元素</span> <p>这是一个块级元素</p></div>...
2018-11-17 17:56:44
424
原创 递归整理
递归的概念：我们通常说的递归就是函数自己调用自己，这种自己调用自己的方式，大大提高了函数的简洁性，但是相应的这种方式不适合复杂或者说是较大数值的计算。递归算是在我们的函数中可以说的上是一种相对高级的技巧了，那我们在编写递归函数的时候，该从什么地方入手呢：找规律 找结束条件显而易见，找规律就是寻找当前的我们需要处理的东西的规律至于结束条件就是找到跳出当前的函数的位置，不然的话这个...
2018-08-23 09:10:53
135
原创 使用vue书写一个简单的日历的demo
最近在项目中遇到了一个需求，在vue中创建一个组件，这个组件显示的是当前的日期，以及在当前的日需要处理的事项，处理的事项的信息会以后端的接口的形式返回。需求确认后，搭建了一下，在这里记录了一下，现在是简单的实现了这个需求，但是肯定的是后期需要进行修改。vue就不多说了，在vue中使用的是原生JS效果图（~~基本没有样式，很low）现在实现的都是最初级的版本，代码里面的容错，还有一些性能上的处理，并...
2018-05-28 16:55:42
10613
4
原创 原生JS编写点击显示隐藏，以及里面需要注意的地方
好长时间不用原生JS编写代码，今天掏出原生JS来实现了一个简单的点击显示和隐藏的功能，果然是好久不写原生JS了，这个功能实现都出现了问题。。。【手动滑稽】【手动滑稽】【手动滑稽】。。现在记录下为什么出现这个问题，做一个备忘吧！首先先是dom结构：<div class="nav_manage"> <p id="manageBtn">系统管理 <span clas...
2018-05-21 16:16:12
6186
原创 面向对象--①
面向过程和面向对象面向过程是一件事“该怎么做“，面向对象是一件事“该让谁来做”，然后那个“谁”就是对象，他要怎么做是他自己的事，反正最后一群对象合力能把事做好就行了举个形象点的例子比如我们要乘车去某个地方。面向过程的方式，你上车后，要告诉司机怎么走，在哪转弯等等。 面向对象方式：司机大哥，我要去天上人间小区。。面向对象和面向过程的区别“面向过程”是一种以过程为中心的编程思想。 就是分析出解决问题所...
2018-03-22 13:59:51
247
原创 前端面试题--③
1. html和xhtml有什么区别？html是一种基本的web网页设计语言，xhtml是一个机遇xml的指标语言最主要的不同：xhtml的元素必须正确的被嵌套，圆度必须关闭，标签必须小写，必须有根元素2. BOX-sizing属性？这个属性是用来控制元素的盒子模型的解析的模式，默认的content-box- content-box：W3C标准的盒子模型；- border-box: IE传统的盒子...
2018-03-19 09:40:53
275
原创 前端面试题--②
1. 浏览器的加载的过程 浏览器接收到html代码，可能是一份完整的文档，也可能是一个chunk，即开始解析。解析过程是先构建dom树，再根据dom树构建渲染树，最后浏览器将渲染树绘制到页面上。 构建dom树的过程即根据html代码自上而下进行构建，当遇到script文件加载／执行会阻塞后面dom树的构建（javascript可能会改变dom树），而遇到css文件则会阻塞渲染树的...
2018-03-14 15:47:39
427
1
原创 nodeJS--①
什么是nodeJs？ Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。Node.js 使用了一个事件驱动、非阻塞式 I/O（input/output） 的模型，使其轻量又高效。node是使用C++编写的基于V8引擎的JS运行环境，同时提供了很多基于ECMAScript的扩展对象。Node.js 的包管理器 npm，成为世界上最大的开放源代码的生态系统。...
2018-03-14 08:50:27
168
原创 前端面试题--①
1. 描述下渐进增强和优雅降级的区别 渐进增强： 一开始就基于低版本的浏览器进行页面的构建，完成基本的功能，然后再针对高级浏览器进行性能，交互，以及效果上的优化； 渐进增强也可以说是 向上兼容； 优雅降级： 一开始就构建站点的完整的功能，然后针对浏览器测试和修复。举个例子，我们在高级浏览器上使用css3的属性，但是在低版本的浏览器上存在兼容的问题，这个就需要我们针对不同的浏览器进行hack； 优...
2018-03-12 17:42:01
331
原创 使用ES6实现一个绚丽的鼠标滑动效果
通常我们在访问一些网站的时候，进行鼠标滑动的时候，会出现非常绚丽的效果，下面我们就用ES6的方式，编写一个简单的鼠标滑动的效果；<canvas id="canvas"></canvas>上面的是这个demo的html的标签，创建了一个canvas标签，其他的处理我们会放在js中进行，我会把所有的js代码都放在下面，可以参照观看： // 0.定义一个取两个数之间的额随机数的方...
2018-03-07 10:49:39
829
原创 webpack梳理
什么是webpack？它是一个前端资源加载/打包工具，将根据模块的依赖关系进行静态分析，并根据规则生成对应的静态资源。好处： 减少了js的加载的文件的个数，生成了静态的资源；安装的过程首先安装node.js在安装了node.js之后使用npm工具进行webpack的安装，安装的代码命令是：npm install webpack -g//进行全局的安装webapckwebpack的初级的使用：可以...
2018-02-24 10:54:12
164
原创 重新定义nightwatch的测试输出文档
一般的来说我们在使用nightwatch测试得到的测试的报告的文件的格式都是xml的，但是这种文件实际上不适合我们查看展示，所以我们就需要一种新的方法来查看我们的测试的具体的情况；npm给我们提供了这样的一个工具包：nightwatch-html-reporter，这是一个能把我们的测试输出的文档转换成 html格式的一种工具，经过这样的转换之后我们在查看我们的测试的结果就更加的直观了；首先我们进...
2018-02-22 15:57:33
1154
原创 将terminal（终端）的内容输出到一个文件的方法
简单的记一个随笔备忘： 上面的图是我们在未进行操作的时候输出的我们文件的结构；简单的举个例子像我们进行上面的操作之后终端上就会输出下面的文件的记录，此时我们可以通过下面的命令，将终端所输出的内容进行单文件的保存：实际上的操作就是在我们正常的查询的后面添加了一个条件 “| tee outPut.txt”，这个条件的作用就是进行我们希望的单文件的保存，另外我们所保存的文件的
2018-02-06 15:24:07
13050
原创 使用canvas画带箭头的圆环
算是一个笔记，省的自己总忘：function draw(el,x,y,r,lineColor,lineWidth,alpha,h1,h2) { var canvas = document.getElementById(el); var ctx = canvas.getContext("2d"); ctx.beginPath(); ctx.s
2017-12-11 09:21:42
2169
转载 HTML中      等6种空白空格的区别
HTML中 等6种空白空格的区别HTML提供了5种空格实体（space entity），它们拥有不同的宽度，非断行空格（ ）是常规空格的宽度，可运行于所有主流浏览器。其他几种空格（ ）在不同浏览器中宽度各异。
2017-07-19 20:47:39
296
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人