zuggs_的博客

原创 linux的tree指令的运用

方法/步骤 -a （ALL）打印所有文件和目录，默认不打印隐藏文件（那些以点开头的文件）tree .表示列出当前目录 tree ..列出上级目录。   -d (Directory)只列出目录。   -f (Full path)列出每个文件的完整路径 -p (permission)打印每个文件的文件类型和权限 -D (date)打印文件最后修改时...

原创 完美替代jq-animate的Velocity.js的使用

前面的话　　Velocity是一款优秀的JS动画库，完全可以作为jQuery的animate的替代品。需要动画功能时，使用Velocity是一个好选择。本文将详细介绍Velocity.js的使用 概述　　Velocity是一个简单易用、高性能、功能丰富的轻量级JS动画库。它和jQuery的animate()有相同的API， 但它不依赖 jQuery，可单独使用。Velocity不仅包含了$.ani...

转载 linux指令之vi/vim

Linux vi/vim所有的 Unix Like 系统都会内建 vi 文书编辑器，其他的文书编辑器则不一定会存在。但是目前我们使用比较多的是 vim 编辑器。vim 具有程序编辑的能力，可以主动的以字体颜色辨别语法的正确性，方便程序设计。相关文章：史上最全Vim快捷键键位图 — 入门到进阶什么是 vim？Vim是从 vi 发展出来的一个文本编辑器。代码补完、编译及错误跳转等方便编程的功能特别丰富...

原创 CSS font-family 各名称一览表

windows常见内置中文字体字体中文名字体英文名字体应用宋体SimSun（浏览器默认）中文名 英文名 浏览器默认黑体SimHei中文名 英文名 浏览器默认微软雅黑Microsoft Yahei中文名 英文名 浏览器默认微软正黑体Microsoft JhengHei中文名 英文名 浏览器默认楷体KaiTi中文名 英文名 浏览器默认新宋体NSimSun中文名 英文名 浏览器默认仿宋FangSong中...

原创 fetch与axios的区别（fetch的真正用法）

首先不得不吐槽一下fetch的response机制了，真的太麻烦了，当我快放弃的时候，才真正懂得怎么用axios使用特别简单axios("http://xxx/xxx.json？a=123'").then((r)=>{    console.log(r)//这里的r是响应结果})但是axios不支持jsonp就比较恶心了，不过我们可以引入jsonp模块，详细使用前面blog...

原创 axios 简易拦截器

引入先从我为什么要写这个无聊又没有挑战的拦截器开始说吧。昨天一同学问了我一个问题：“诶，大哥啊，你那个后台管理系统demo为什么要设置拦截器，这个拦截器是干嘛用的？” 我的回答很简单，因为这个问题实际上真的很简单：“拦截器就是在你的请求要做接下来的处理时，多一次或多次验证。例如：你写了几个请求数据的接口，开启服务后，用户没登录直接访问这些接口，也是可以拿到数据的，但这就违背了后台管理系统必须...

原创 前端编码之escape、encodeURI和encodeURIComponent

一、前言讲这3个方法区别的文章太多了，但是大部分写的都很绕。本文试图从实践角度去讲这3个方法。 二、escape和它们不是同一类简单来说，escape是对字符串(string)进行编码(而另外两种是对URL)，作用是让它们在所有电脑上可读。编码之后的效果是%XX或者%uXXXX这种形式。其中 ASCII字母、数字、@*/+ ，这几个字符不会被编码，其余的都会。最关键的是，当你需要对URL编码时，请...

原创 NPM的jsonp模块用法

方式：npm/cnpm i jsonp -S / yarn add jsonp -S先贴上官方源码/** * Module dependencies */var debug = require('debug')('jsonp');/** * Module exports. */module.exports = jsonp;/**...

原创 后端加密及tocken

Crypto 生成秘钥方式：openssl genrsa  -out server.pem 1024 createHmac 加密方式：  var pem = fs.readFileSync(__dirname+"/../server.pem”);//读取密码文件;var key = pem.toString("ascii”);//转换成ascii吗；co...

原创 socket，socket.io,mongodb

Socket     网络上的程序实现双向的数据链接，这个链接的一端成为socket。          1.Socket是一个持久链接。     2.Socket是双向通信的。    Socket VS ajax轮询        ajax轮询 ， 是利用客户端来发送请求，每隔几秒发送一个http请求，服务器压力大。    Socket不会，一旦链接不会断开，可以实现实时通信。 比如微信的朋友圈...

原创 nodejs之express框架

app.use(express.static(path.resolve(__dirname,"public")))常量配置结束之后，我们就可以在 ejs文件中引入 script 标签;在项目目录下建立结构：        public              /scripts                       /app.js在模板中就可以引入该scripts标签，去关联app.js。&...

原创 nodejs的模块总结

Part1:1.url模块       浏览器是一个非常神奇的东西， 当我们在浏览器的地址栏里输入一段地址的时候，他就会帮我们给服务器发送一个请求，这个请求会被服务器解析成稀奇古怪的模样，从而浏览器发生页面跳转，数据变更等等一系列神奇的事情。     比如，当我们在百度上搜索一个hello的时候注意观察，百度地址栏里发生了啥 后面跟上了一串代码， 通过前面的学习我们知道这是浏览器在以GET的方式对...

原创 nodejs基础及npm、yarn

part 1：NodeJS是个啥？   Node简介：                 NodeJS是一个JavaScript服务端的语言， 基于V8引擎的一个JS服务器语言。              Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型，使其轻量又高效 , 适合高并发。       ...

原创 countupjs，一个有趣的数字翻滚动画

CountUp.js 是一个零依赖的轻量级 JavaScript 库，可用于快速创建以更有趣的方式显示数字的动画。用法参数:target = html元素的id，input，svg text元素，或者计数发生时先前选择的元素/输入的varstartVal = 你要开始的值endVal = 你想要达到的价值decimals = （可选）数字中的小数位数，默认为0duration = （可选）持续时间...

原创 Github提交（已存在文件或重新建一个新项目）

命令行指令Git 全局设置git config --global user.name "。。。"git config --global user.email "。。。“创建新版本库git clone http://。。。。。cd lltouch README.mdgit add README.mdgit commit -m "add README"git push -u origin...

原创 前端常用报错

一般我们运行代码的时候，在控制台报错会相应的显示你错误的行数，找到那一行，查找你相应的错误1、xxx is not definedxxx 没有定义  2、xxx is not a functionxxx 不是一个函数xxx此时是undefined3、Cannot read property 'xxx' of undefined不能读取undefined的xxx属性xxx前面的变量是undefine...

原创 mobile移动端h5

移动端开发我们现在关注的点还在移动M站上，或者我们可以叫做webapp，其实就是运行在移动端浏览器中的web网站app:application应用程序。手机软件:主要指安装在智能手机上的软件，完善原始系统的不足与个性化。移动端开发是与PC端肯定是有很大不同的，所以我们需要学习如何在移动设备上开发完美适配的app开发移动端应用我们需要学习的知识点可以分成如下几个：移动端布局适配移动端事件移动端交互效...

原创 ES6自己的一些理解

一.什么是es6es6 是js语言的下一代标准，15年6月发布，也就是ECMAScript（2015）ECMAScript就是JavaScript的国际标准，js是es的实现es的历史：1996年11月，网景公司把js语言提交给国际标准组织ECMA，希望能成为国际标准推广，1997年，ECMA发布ECMAScript 1.0兼容的不是很好，但是写起来方便也多了很多新的好玩的东西编译的话咱们就暂时先...

原创 最详细的vue总结（看到发困）

### Vue> Vue是一个前端js框架，由尤雨溪开发，是个人项目Vue近几年来特别的受关注，三年前的时候angularJS霸占前端JS框架市场很长时间，接着react框架横空出世，因为它有一个特性是虚拟DOM，从性能上碾轧angularJS，这个时候，vue1.0悄悄的问世了，它的优雅，轻便也吸引了一部分用户，开始收到关注，16年中旬，VUE2.0问世，这个时候vue不管从性能上，还是从...

原创 NodeJS常用模块介绍

收集了NodeJS开发中常用的一些模块。MVC框架 - ExpressExpress 是轻量灵活的Nodejs Web应用框架，它可以快速地搭建网站。Express框架建立在Nodejs内置的Http模块上，并对Http模块再包装，从而实际Web请求处理的 功能。它支持多种前端模板，如Jade, EJS等。它是T.J大神的作品，不过已经交由其它团队维护了。Koa是T.J大神的另外一个作品，号称下一...

原创 Braft Editor的使用及API

一个基于draft-js的Web富文本编辑器，适用于React框架，兼容主流现代浏览器。现已支持在typescript，使用npm或者yarn安装@types/braft-editor即可,墙裂感谢@petitspois提供支持使用braft-convert的同学请将braft-convert升级到v1.9.1以确保功能同步如果需要在IE10中只用本项目，请参考：braft-polyfill已知问...

原创 webpack配置

webpack安装Step 1: 首先安装Node.js, 可以去Node.js官网下载.Step2: 在Git或者cmd中输入下面这段代码, 通过全局先将webpack指令安装进电脑中npm install webpack -gStep3: 使用Git Bash here 或者 cmd cd命令使当前目录转到当前项目的目录下, 然后输入下面这段命令npm init接下来会弹出一些信息, 就是一些...

转载 Yslow安装使用, 网站性能工具Yslow

本文whyboy站长讲解 Yslow安装 以及 Yslow使用 ,打开Yslow官网就能看到有四个版本可供选择：火狐（firefox）浏览器、谷歌（chrome）浏览器、欧朋（opera）浏览器和移动版。本文介绍的火狐版本文whyboy站长讲解Yslow安装以及Yslow使用,打开Yslow官网就能看到有四个版本可供选择：火狐（firefox）浏览器、谷歌（chrome）浏览器、欧朋（opera）...

原创 谷歌YSlow准则

谷歌YSlow准则YSlow可以对网站的页面进行分析,并告诉你为了提高网站性能,如何基于某些规则而进行优化。测试个人站点通过测试个人站点可以获得下面的数据23条准则Make fewer HTTP requests译为:减少HTTP请求次数Use a Content Delivery Network (CDN)译为:使用CDNAvoid empty src or href译为:避免空的src和hre...

原创 Mac上如果看不到.git目录的解决方法

Mac OS X上，如果需要查看.git目录下的隐藏文件，操作很简单： 做法是：打开一个Terminal终端窗口，输入：defaults write com.apple.finder AppleShowAllFiles TRUE然后重启Finder，输入：killall Finder如果你完成了需要的操作，恢复隐藏设置，同样打开Terminal终端窗口，输入：defaults write com....

原创 前端的一些资料和工具

开发工具sublime TextSublime Text具有漂亮的用户界面和强大的功能，例如代码缩略图，Python的插件，代码段等。还可自定义键绑定，菜单和工具栏。Sublime Text 的主要功能包括：拼写检查，书签，完整的 Python API ， Goto 功能，即时项目切换，多选择，多窗口等等。Sublime Text 是一个跨平台的编辑器，同时支持Windows、Linux、Mac ...

原创 JavaScript 作用域和作用域链

JavaScript 作用域作用域就是变量与函数的可访问范围。在JavaScript中，变量的作用域有全局作用域和局部作用域两种。全局作用域(Global Scope)在代码中任何地方都能访问到的对象拥有全局作用域，一般来说以下 3 种情形拥有全局作用域。最外层函数和在最外层函数外面定义的变量拥有全局作用域var outVariable = "我是最外层变量"; //最外层变量function ...

原创 JavaScript语法、对象、函数

本篇为第一部分包含书中前三章内容：语法、对象和函数。原书中第一章为精华，做了一些周边介绍，略去。语法空白这里说一下JavaScript的注释，一种是 /* */ 包围的块注释，另一种是 // 开头的行注释。因为块注释的字符可能是JavaScript中正则表达式字面量，因此不是很安全，如：/* var rm_a = /a*/.match(s)*/标识符标识符由一个字母开头，后面可选择性的...

原创 JS继承、数组

继承继承的两大好处：代码重用，引入一套类型系统的规范。伪类JavaScript 通过构造器函数产生对象。构造器调用模式，即用new前缀去调用一个函数。var Mammal = function(name) { this.name = name}Mammal.prototype.getName = function() { return this.name}Mammal....

原创 readline模块实现Node.js的输入输出

学Java的时候，有println和Scanner控件，C++有cout和cin，Node.js也有如同Java和C++的标准输入，当然，是用JavaScript实现的，它就是Readline模块（从这个角度看的话，能不能把Node.js当作JavaScript的编译器？）。下面详细介绍一下这个模块，来实现Node.js的控制台输入输出。ReadlineReadline是Node.js里实现标准输...

原创 JavaScript的垃圾回收机制与内存管理

一、垃圾回收机制—GCJavascript具有自动垃圾回收机制(GC:Garbage Collecation)，也就是说，执行环境会负责管理代码执行过程中使用的内存。原理：垃圾收集器会定期（周期性）找出那些不在继续使用的变量，然后释放其内存。JavaScript垃圾回收的机制很简单：找出不再使用的变量，然后释放掉其占用的内存，但是这个过程不是实时的，因为其开销比较大，所以垃圾回收器会按照固定的时间...

原创 虚拟Dom与diff算法

原创 git指令

原创 React 小结

# React框架学习### React的起源和发展 起初facebook在建设instagram（图片分享）的时候嘞，因为牵扯到一个东东叫数据流，那为了处理数据流并且还要考虑好性能方面的问题嘞，Facebook开始对市场上的各种前端MVC框架去进行一个研究，然而并没有看上眼的，于是Facebook觉得，还是自己开发一个才是最棒的，那么他们决定抛开很多所谓的“最佳实践”，重新思考前端界面的构...

原创 Webstorage

原创 h5离线缓存

转载 MVC，MVP 和 MVVM

一、MVCMVC模式的意思是，软件可以分成三个部分。视图（View）：用户界面。控制器（Controller）：业务逻辑模型（Model）：数据保存各部分之间的通信方式如下。View 传送指令到 ControllerController 完成业务逻辑后，要求 Model 改变状态Model 将新的数据发送到 View，用户得到反馈所有通信都是单向的。二、互动模式接受用户指令时，MVC 可以分成两种...

原创 ES7和ES8新特性

ES7就是ES2016规范，ES8就是ES2017规范。本文主要内容转载自博客园大转转FE的10分钟学会ES7+ES8，但是这篇文章没有讲ES8的装饰器(Decorator)，所以另转载阮一峰老师的ESMAScript6标准入门中关于装饰器的部分内容。----------------------------------------(10分钟学会ES7+ES8)-------------------...

原创 前端面试之算法题

虽说我们很多时候前端很少有机会接触到算法。大多都交互性的操作，然而从各大公司面试来看，算法依旧是考察的一方面。实际上学习数据结构与算法对于工程师去理解和分析问题都是有帮助的。如果将来当我们面对较为复杂的问题，这些基础知识的积累可以帮助我们更好的优化解决思路。下面罗列在前端面试中经常撞见的几个问题吧。Q1 判断一个单词是否是回文？回文是指把相同的词汇或句子，在下文中调换位置或颠倒过来，产生首尾回环的...

原创 从Promise来看JavaScript中的Event Loop、Tasks和Microtasks

前几天面试的时候，碰到了这样一个题：说出下列代码的执行结果：setTimeout(function () { console.log(1)}, 0);new Promise(function executor(resolve) { resolve();}).then(function () { console.log(2);}); //2,112345...