项目要用到 Base64, 在网上找了好几个用着都者不是特别爽, 索性写一个.

项目地址

GitHub: cnwhy/Base64.js

安装

1

npm i @cnwhy/base64

为何重复造轮子?

1. btoa , atob 只支持 Latin1 字符.
2. Base64编/解码本该与字符串无关, 但几乎所有 Base64 的decode方法都输出字符串, 限制了使用场景.

   本库的 decode() 方法单纯将 Base64 字符串解析为Uint8Array; 但重写了返回字节数组的toString()方法, 默认以UTF-8编码解析为字符串(类似 nodejs 中 buffer 对像的toString()).

3. ++常用的的 Base64 编码库处理 javascript 字符串时会主动替换错误(空)编码字符, 导致解码的数据与原数据不一至.++
   比如用 nodejs 中的 Buffer:

   1 2 3 4

   var s = '\ud800'; //U+d800 属于代理区, 是一个空码, 如果从utf16来看,是一个4字节字符的一半. var b64 = Buffer.from(s).toString('base64'); var _s = Buffer.from(b64, 'base64').toString(); console.log(s == _s); //false

   本库对于字符串的转换默认用UTF-8编码, 但无视无效符(解码按同一规则), 保证 js 的字符串(UCS-2)可以无损转换.

4. 其它 Base64 库 固定了 Base64 编码表, 与字符串的编码方式;

   本库抽象出 Base64 算法, 支持自定义的 编码表 和 字符串编码方式, 适应更多特殊场景;

5. 多数项目只需要 encode 或 decode , 而我又不想copy代码.

   本库有ES6风格模块文件, 利用 webpack 或 rollup 可打出最简包.

兼容性

nodejs , 浏览器通用;

不支持ArrayBuffer的环境将会用Array代替Uint8Array.

demo

字符串 编码,解码

1
2
3
4
5
6
7
8
9
10

import { encode, decode } from '@cnwhy/base64';
let str = '中国\u{10121}美国'; //中国𐄡美国 注: 𐄡是一个4字节字符
let b64_str = encode(str);
let _str = decode(b64_str).toString();
console.log([str, b64_str, str == _str].join('\n'));
/*
中国𐄡美国
5Lit5Zu98JCEoee+juWbvQ==
true
*/

编码 Uint8Array ArrayBuffer

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26

import { encode, decode } from '@cnwhy/base64';
let arr = [1,2,3,4,5];
let bytes = new Uint8Array([1, 2, 3, 4, 5]);
let buffer = Buffer.from([1, 2, 3, 4, 5]);
[arr,bytes,buffer,].forEach((v)=>{
let b64 = encode(v);
let u8 = decode(b64);
console.log(Array.from(v).toString());
console.log(b64.toString());
console.log(Array.from(u8).toString());
console.log('--');
})
/*
1,2,3,4,5
AQIDBAU=
1,2,3,4,5
--
1,2,3,4,5
AQIDBAU=
1,2,3,4,5
--
1,2,3,4,5
AQIDBAU=
1,2,3,4,5
--
*/

decode 函数始终 Uint8Array 对像,不支持 Uint8Array 的环境返回 Array

自定义码表与字符串编码方式

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

// 定义一个看起来乱码的 Base64 转换方法, 并且 字符串用 UTF16 编码;
import { createEncode , createDecode } from '@cnwhy/base64';
const TABLE = 'xQh}s7*y~A|nkj4Bf%z1R,P+)mMS{(&EWCKegp6r!OX</LuY-l9^ZJ#cTU[vHda$'; // base64码表, 不重复的64个ascii字符
const PAD = '.'; // 补位符, 一个ascii字符
const Utf16Encode = function(str) {
let cods = str.split('').map(s => s.charCodeAt(0));
return new Uint8Array(new Uint16Array(cods).buffer);
}
const Utf16Decode = function(arr) {
let u16 = Array.from(new Uint16Array(arr.buffer));
return u16.map(c => String.fromCharCode(c)).join('');
}
//自定义base64 转换方法
const myEncode = createEncode(TABLE,PAD,Utf16Encode);
const myDecode = createDecode(TABLE,PAD,Utf16Decode);
let str = '中国\u{10121}美国';
let b64_str = myEncode(str);
let _str = myDecode(b64_str).toString();
console.log([str, b64_str, str == _str].join('\n'));
/*
中国𐄡美国
nRvd,W})~(#4E$JP
true
*/

API

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

Base64 = {
BASE64_TABLE: "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
BASE64_URL_TABLE: "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789-_";
PAD: "=";
// UTF8 编码 解码; 可做为 strEncode strDecode 参数;
utf8Encode(str:string):Uint8Array|number[];
utf8Decode(utf8arr:Uint8Array|number[]):string;

//Base64 编码 解码
encode(input:string|ArrayBuffer|Uint8Array|number[]):string;
decode(base64str: string) => number[]|Uint8Array;

//适用于URL的Base64 编码 解码( "_" "-" 替换 "/" "+");
encodeURL(input:string|ArrayBuffer|Uint8Array|number[]):string;
decodeURL(base64str: string) => number[]|Uint8Array;

//创建自定义Base64 encode , decode 函数
createEncode(strEncode: Function): (input: any) => string;
createEncode(table?: string[] | string, pad?: string, strEncode?: Function): (input: any) => string;
createDecode(strDecode: Function): (base64str: string) => Uint8Array | number[];
createDecode(table?: string[] | string, pad?: string, strDecode?: Function): (base64str: string) => Uint8Array | number[];
}

这么好无的东西,不支持中文 不能忍;
捣鼓半天 找到一个 可以转成正常的角本, 不过作者弄成一个框架的插件. 用起来有点麻烦.

索性重新写了个: https://gist.github.com/cnwhy/7cad3be853a188823c077df1182f6b1a

用法很简单,如果你用node,一行代码的事:

1

npx https://gist.github.com/cnwhy/7cad3be853a188823c077df1182f6b1a <svgfile>

这是转完后的效果:

非严格等号比较规则

javascript 使用 Abstract Equality Comparison Algorithm 规则进行比较

总结如下:

toPrimitive 规则:
优先调用对像的 valueOf 方法转换;
如果对像没有 valueOf 方法, 或者 valueOf 方法返回的值不是原数据类型,
则调用 toString 方法转换;

安装

1

npm i axios-extra

使用

默认最大 10 并发, 0 重试;

1 2	//const axios = require('axios'); const axios = require('axios-extra'); //修改一行代码 无感使用 axios-extra

设置并发数,及重试次数

方式一: 用 axios.defaults 修改默认配制

1
2
3

const axios = require('axios-extra');
axios.defaults.maxConcurrent = 1; //修改并发为1
axios.defaults.queueOptions.retry = 2; //修改默认重试次数为2

方式二: 用 axios.create(config) 创建新的 axios

1
2
3
4
5
6
7
8

const axios = require('axios-extra');
let axios1 = axios.create({
maxConcurrent: 1, //并发为1
queueOptions: {
retry: 3, //请求失败时,最多会重试3次
retryIsJump: true //是否立即重试, 否则将在请求队列尾部插入重试请求
}
});

方式三: 为某一次特殊请求单独设置重试

设置config参数的queueOptions属性即可;

1
2
3
4
5
6

const axios = require('axios-extra');

//本次get请求若不成功,将重试3次
axios.get('http://xxx',{
queueOptions: {retry: 3}
})

axios 的发送请求方法均可使用:

• axios(config)
• axios.request(config)
• axios.get(url[, config])
• axios.delete(url[, config])
• axios.head(url[, config])
• axios.options(url[, config])
• axios.post(url[, data[, config]])
• axios.put(url[, data[, config]])
• axios.patch(url[, data[, config]])

补充

axios-extra利用ES6的Proxy对axios进行扩展, 请注意兼容.

并发与重试都是基于队列实现的, 默人重试是在队列的最后重新插入请求.
retryIsJump 设置为true最会在队列头部插入请求, 实现立即重试

更多 queueOptions 配制可参看这里

属性遍历/检查

“普通属性” 指可枚举的自有属性, 检索不会区分 “数据属性” 和 “访问器属性”;
__proto__ 非常特殊,常见JS引擎下除了 in 运算符都不会检出;

附:属性描述符说明

1
2
3
4
5
6
7
8
9
10

{
"configurable": false, //为 true 时，该属性描述符才能够被改变，同时该属性也能从对应的对象上被删除。默认为 false。
"enumerable": false,   //为true时，该属性才能够出现在对象的枚举属性中。默认为 false。
//数据描述符(数据属性)同时具有以下可选键值：
"value": undefined, //该属性对应的值。可以是任何有效的 JavaScript 值（数值，对象，函数等）。默认为 undefined。
"writable": false,  //为true时，value才能被赋值运算符改变。默认为 false。
//存取描述符(访问器属性)同时具有以下可选键值：
"get": undefined, //一个给属性提供 getter 的方法，默认为 undefined。
"set": undefined, //一个给属性提供 setter 的方法，默认为 undefined。
}

this算是javascript中又爱又恨的东西了. 其实this的概念并没有多少, 本文将把this的概念用示例梳理一次.

最基本的this概念

指向globe的this

1
2
3
4
5
6
7
8
9

//浏览器内 落单的this, 普通调用的函数中的this 都指向windows对像;
this === window; //true
(function(){ return this; })() === window; //true

function A(){
return this;
}
A() === window; //true
// node 中则指向 globe

对像属性函数中的this指向父对像

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

function This(){
return this;
};
var obj = {
A: function(){return this},
B: This,
C: {
CA: This
}
};
console.log(This() === windows); //true
console.log(obj.A() === obj); //true
console.log(obj.B() === obj); //true
console.log(obj.C.CA() === obj); //false
console.log(obj.C.CA() === obj.C); //true

构建函数中的this指向实例化对像

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

function C(name){
this.name = name;
}
var a = new C('a');
console.log(a.name); // a;

//ES6
class C1{
constructor(name){
this.name = name;
}
}
var b = new C1('b');
console.log(b.name); // b

//父类构建函数中的`this`也指向实例化的对像
class C2 extends C1{
constructor(name,age){
super(name);
this.age = age;
}
}
var c = new C2('c',10);
console.log(c.name); // c
console.log(c.age); // 10

call, apply 改变this指向

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

function D(){
console.log('D:' + this);
}
var Obj = {
name : 'obj',
show : function(){
console.log('name:' + this.name);
}
}

//call , apply 会执行函数并改变this的指向
D.call('call'); // D:call
D.apply('apply'); // D:apply
Obj.show(); // name:obj
Obj.show.call({name:'call'}); // name:call
Obj.show.apply({name:'apply'}); // name:apply

bind 方法会生成一个绑定了this的新函数

1
2
3
4
5
6
7
8
9
10
11
12
13
14

var D = function(){
console.log('D:' + this);
}

var DBind = D.bind('bind');
DBind(); // D:bind

// call,apply不能改变this指向, 再使用bind定也无法改变
DBind.call('call'); // D:bind
DBind.apply('apply'); // D:bind
DBind.bind('bind1')(); // D:bind

//但不会改变 new 运算符执函时 this 的指向.
new DBind(); // D:[object Object]

箭头函数 this指向不变

1
2
3
4
5
6
7
8
9
10
11

//箭头函数中的this指上下文的this, 无法用 call/apply 和 bind改变;
function getShow(){
return ()=>{
console.log("this:" + this);
};
}
var show = getShow.call('a');
show(); // this:a
show.call('b'); // this:a
show.apply('c'); // this:a
show.bind('d')(); // this:a

实用 示例

1. 类型判断

   1 2 3

   function getType(obj){ return Object.prototype.toString.call(obj).slice(8,-1).toLowerCase(); };

2. arguments 转 array

   1 2 3

   function fn(){ var args = [].slice.call(arguments,0) }

前端组件的模块化己发展了很久 这篇文章将对 iife amd cmd cjs umd 和 es6 做一个介绍

IIFE

IIFE 其实在大家应该都用过,只不过没想到还有个名字;
IIFE 标准简单说就是执行一个匿名函数, 模块代码放入匿名函数中, 隔离变量作用域,内存释放等问题;

1
2
3

(function(global){
    // code
})(this);

AMD 和 CMD

介绍 AMD 不得不说 RequireJS, 它的出现解决了模块依赖的问题, 使得前端模块化进程加速发展, AMD规范) 其实是RequireJS出来之后再提出来的.

1
2
3
4
5
6
7
8
9
10

define('module1','module2'],function(m1,m2){    
    require(['module3'],function(m3){

    })
});
// commonjs 风格:
define(function(require, exports, module){
    var m1 = require('module1');
    var m2 = require('module2');
})

SeaJS最初以 就近加载 以及支持 加载 CSS 等特点吸引了很多用户, 并提出了 CMD规范. 但在 RequireJS 也支持这些特性之后, 渐渐淡出;
虽然 SeaJS 没有明显的缺点,但统一标准未尝不是一件好事;

1
2
3
4
5
6
7
8
9

define(function(require, exports, module) {
    //同步加载
    var m1 = require('module1');

    //异步加载
    require.async('module2',function(m2){

    })
});

CJS

CJS 其实应该叫 CommonJS;
CommonJS是nodejs也就是服务器端广泛使用的模块化机制。该规范的主要内容是，模块必须通过 module.exports 导出对外的变量或接口，通过 require() 来导入其他模块的输出到当前模块作用域中。
CommonJS 中的模块加载是同步的, 不适合在浏览器中使用;

1
2
3

var m1 = require('module1');
//code
module.exports = {}

UMD

UMD 其实不是什么标准, 可以看成是 IIFE amd + cjs 的兼容版.
也就是一个js文件, 可以用 script 标签引用加载, 用 RequireJS 加载, 也可以在 node 当成 CommonJS 模块加载;

1
2
3
4
5
6
7
8

(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
typeof define === 'function' && define.amd ? define(factory) :
(global.NAME = factory());
}(this, (function () {
    //code
    return obj;
})));

如果还想兼容 CMD 判断一下 define.cmd 即可;

ES6

ES6 模块其实是 ECMAScript 2015 标准 在语言层面上,实现了模块功能;
ES6 而且实现得相当简单，import 引入 export 导出.
ES6 模块的设计思想是尽量的静态化，使得编译时就能确定模块的依赖关系，以及输入和输出的变量。
现在许多打包工具利用 ES6 的特点, 按需提取代码, 打出的包更加精简.

1
2
3
4
5
6

//按需加载依赖
import { stat, exists, readFile } from 'fs';

//暴露接口
export default obj; // 默认对外接口
export var foo = 'str'; // 名称为`foo`的对外接口

总结

iife 的方便会让其长期存在
amd 在浏览器端还是霸主阶段
在服务端 es6 标准化取代 cjs 是一种趋势, 但cjs标准的庞大类库,会让它暂时难以取代.

延伸

systemjs 加载器可以加载上述所有标准的模块.
rollup 可以把 es6/cjs 打包成各种标准的文件.

项目地址:

https://github.com/cnwhy/GBK.js

特性

• 就是比一般的GBK库要小, 主要是改进了之前网上流传的一个GBK库, 大概50几K, 改进后的库31k, 而正常的GBK编码表就要到200k了;
• 增加了 URI 相关的函数;
• 项目中包含了压缩GBK编码表整套方案,方便自行优化,生成更小的库文件.

API

GBK.encode({string}) 解码GBK为一个字节数组

1
2

GBK.encode('时顺地?abc地')
> [ 202, 177, 203, 179, 181, 216, 63, 97, 98, 99, 181, 216 ]

GBK.decode({BbyteArry}) 解码GBK编码的字节数组 返回字符串

1
2

GBK.decode([ 202, 177, 203, 179, 181, 216, 63, 97, 98, 99, 181, 216 ])
> 时顺地?abc地;

URI相关函数

GBK.URI.encodeURI({String}) 转换规则和 encodeURI 函数一至

1
2

GBK.URI.encodeURI('https://abc.com/?kk=abv&bb=火车头#top')
> https://abc.com/?kk=abv&bb=%BB%F0%B3%B5%CD%B7#top

GBK.URI.decodeURI({String}) 转换规则和 decodeURI 函数一至

GBK.URI.encodeURIComponent({String}) 转换规则和 encodeURIComponent 函数一至

1
2

GBK.URI.encodeURIComponent('https://abc.com/?kk=abv&bb=火车头#top')
> https%3A%2F%2Fabc.com%2F%3Fkk%3Dabv%26bb%3D%BB%F0%B3%B5%CD%B7%23top

GBK.URI.decodeURIComponent({String}) 转换规则和 decodeURIComponent 函数一至

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

.box {
border: 1px solid #999;
height: 200px;
width: 300px;
position: relative;
}

.box>div {
width: 90px;
height: 90px;
border: 1px solid #000;
transition: all 0.3s;
}

.box>div:hover {
width: 150px;
height: 150px;
}

不脱离文档流

利用line-height

此方法关键是把行高设置成和容器高度相同

1
2
3
4
5
6
7
8
9

<style>
.line-height {
text-align: center;
height: 100px;
line-height: 100px;
}
</style>

<div class="box line-height">aaaaa</div>

优点：简单，方便，兼容所有浏览器。
缺点：只支持单行，主要适用于单行文本。

table 方式

table 的单元格是天生支持垂直居中的容器，其它标签可以设置 display 达到相同效果

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

<style>
.table {
display: table-cell;
text-align: center;
vertical-align: middle;
}

.table>div {
display: inline-block;
vertical-align: middle;
}
</style>

<div class="box table">
sdfsdfd1111111111111s<br>sdfsdfds<br>sdfsdfds<br><div></div>
</div>

优点：支持多行，兼容所有浏览器。
缺点：IE7以下要用 table 标签,嵌套太多; 单元格属性与普通容器行为有差异。

vertical-align

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

<style>
.vertical-align {
text-align: center;
}

.vertical-align::before { 
content: "";
display: inline-block;
height: 100%;
width: 0;
vertical-align: middle;
}

.vertical-align>div {
display: inline-block;
vertical-align: middle;
}
</style>

<div class="box vertical-align">
<div></div>1212
</div>

优点：文本和其它内联元素混排时，垂直居中效果好；兼容所有浏览器;
缺点：不支持多行；IE8以下需要添加一个额外的空标签（替代伪元素）才能达到最好效果；

flex-box 布局

css3 中新增的布局方式, 解决了很多css2布局中的痛点, 垂直居中只是小意思

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

<style>
.flex {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
align-content: center;
}

.flex>div {
width: 50px;
height: 50px;
margin: 5px;
display: inline-flex;
}

.flex>div:hover {
width: 60px;
height: 60px;
}
</style>

<div class="box flex">
1111
<div></div>
<div></div>
<div style="height:80px;"></div>
<div></div>
<div></div>
</div>

优点：支持多行，flex布局是一种趋势，并有很多新特性；
缺点：IE10+才支持flex布局

grid 布局

一种网格思维的新布局方式, 垂直居中同样没问题, grid 还处于草案阶段

1
2
3
4
5
6
7
8
9
10
11

<style>
.grid {
display: grid;
grid-template-columns: auto;
grid-template-rows: auto;
justify-items: center;
align-items: center;
}
</style>

<div class="box grid"><div></div></div>

优点：支持多行，并有很多新特性；
缺点：兼容性差，grid 还处于草案阶段

脱离文档流

这里只演示 absolute 定位的元素，同样适用 fixed 定位的元素

margin负值

1
2
3
4
5
6
7
8
9
10
11
12
13
14

<style>
.absolute-margin>div {
position: absolute;
left: 50%;
top: 50%;
width:100px;
height:100px;
border:1px solid #000;
margin-left: -51px;
margin-top: -51px;
}
</style>

<div class="box absolute-margin"><div></div></div>

优点：兼容好；
缺点：元素需要固定尺寸；

CSS3移位法

1
2
3
4
5
6
7
8
9
10

<style>
.absolute-translate>div {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
</style>

<div class="box absolute-translate"><div></div></div>

优点：元素可以不定宽高；
缺点：用到CSS3；可能会碰到渲染模糊的情况；

margin auto

普通块元素可以用 margin: 0 auto; 实现水平居中，现在用同样的原理来垂直居中，因为要配 right bottom，所以不支持IE6

1
2
3
4
5
6
7
8
9
10
11
12

<style>
.absolute-auto>div {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
margin: auto;
}
</style>

<div class="box absolute-auto"><div></div></div>

优点：居中效果，兼容好；
缺点：需要标明尺寸，不支持被内容撑大的容器；极限情况下（元素比容器大时），元素不居中；

总结

1.筛选差异文件

git 比较差异当然是 git diff 命令了

语法如下：

1
2
3
4
5

git diff [options] [<commit>] [--] [<path>…​]
git diff [options] --cached [<commit>] [--] [<path>…​]
git diff [options] <commit> <commit> [--] [<path>…​]
git diff [options] <blob> <blob>
git diff [options] [--no-index] [--] <path> <path>

options 有这么一个参数

1
2

--name-only  
    Show only names of changed files.

可以试一下, 比较本地 master 和 origin/master 的差异

1
2
3

> git diff master origin/master --name-only
wp/wp-content/themes/alcatel/csr.php
wp/wp-content/themes/alcatel/service_privacy_policy.php

OK 这就是我们需要的

2.打包

有了文件列表，打包就好办了

用 tar 命令打包

1

> tar -zcvf diff.tar.gz $(git diff master origin/master --name-only)

用 zip 命令打包

1

> zip -q -r diff.zip $(git diff master origin/master --name-only)

用 git archive 命令打包

其实最实用的还是直接用git的归档命令打包
好处就是不需要额外东西 windows下的 PowerShell 和 git bash 也能用

语法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

git archive [<options>] <tree-ish> [<path>...]
git archive --list
git archive --remote <repo> [--exec <cmd>] [<options>] <tree-ish> [<path>...]
git archive --remote <repo> [--exec <cmd>] --list
    
    --format <fmt>        archive format
    --prefix <prefix>     prepend prefix to each pathname in the archive
    -o, --output <file>   write the archive to this file
    --worktree-attributes
                          read .gitattributes in working directory
    -v, --verbose         report archived files on stderr
    -0                    store only
    -1                    compress faster
    -9                    compress better

    -l, --list            list supported archive formats

    --remote <repo>       retrieve the archive from remote repository <repo>
    --exec <command>      path to the remote git-upload-archive command

archive 命令支持的打包格式可以用 git archive -l 查看
正常情况可以省略 --format ,git会根据输出的文件名判断格式

打包代码如下:

1

> git archive -o diff.zip master $(git diff master origin/master --name-only)

linux 还可以用上管道符号

1

> git archive master $(git diff master origin/master --name-only) | gzip > diff.zip

注意:如果 diff 命令结果是空 archive 会打包整个项目

3.常用增量包命令

当前分支与master差异包

1

> git archive -o update.zip HEAD $(git diff master --name-only)

最后一次commit差异包

1

> git archive -o lastcommit.zip HEAD $(git diff HEAD^ --name-only)

从 x 中提取 x 与 y 的差异文件打包.

x , y 可以是 分支, tag, commit

1

> git archive -o x_y.zip x $(git diff x y --name-only)

fs-extra v4.x

异步

异步方法不传callback,都将返回Promise对像；

copy

copy(src, dest, [options, callback]) 复制文件/文件夹

emptyDir

emptyDir(dir, [callback]) 清空一个目录(删除目录中的所有文件), 如果目录结构不存在则创建它

别名: emptydir()

ensureFile

ensureFile(file, [callback]) 确保文件存在。 如果文件不存在，则创建目录结构及文件

别名: createFile()

ensureDir

• ensureDir(dir, [callback]) 确保目录存在。 如果目录结构不存在，则创建它

  别名: mkdirs(), mkdirp()

ensureLink

ensureLink(srcpath, dstpath, [callback]) 确保链接(dstpath)存在。如果不存在，则创建它 (硬链)

ensureSymlink

ensureSymlink(srcpath, dstpath, [type, callback]) 确保符号链接(dstpath)存在。如果不存在，则创建它 (硬键)

mkdirs

同 ensureDir

move

move(src, dest, [options, callback]) 移动文件或目录，甚至跨设备。

outputFile

outputFile(file, data, [options, callback]) 相当 fs.writeFile 方法的增强版，会自动创建目录结构

outputJson

outputJson(file, object, [options, callback]) 类似 outputFile 但会自动把object转成JSON字符串输出到文件

别名: outputJSON()

pathExists

pathExists(file[, callback]) 检查文件是否存在

readJson

readJson(file, [options, callback]) 读取一个JSON文件，并解析成对像。

别名: readJSON()

remove

remove(path, [callback]) 删除一个文件或目录，会自动递归删除目录内的文件。

writeJson

writeJson(file, object, [options, callback]) 将对像序列化为JSON字符串写入文件。

同步

• copySync
• emptyDirSync
• ensureFileSync
• ensureDirSync
• ensureLinkSync
• ensureSymlinkSync
• mkdirsSync
• moveSync
• outputFileSync
• outputJsonSync
• pathExistsSync
• readJsonSync
• removeSync
• writeJsonSync

三个基本区域

Staged Snapshot : index , 暂存区 , 索引
Working Directory : 工作区
Commit History : commit 历史 , 版本库

初始化/克隆

• git init 初始化仓库
• git clone <git仓库地址/路径> 克隆

修改和提交

查看文件状态/比较差异/加入暂存区

• git status 显示仓库状态
• git status -s 简要显示仓库的状态

• git diff 比较变动 默认比较工作区的变动

  • git diff <branch1> <branch2> 比较两个分支
  • git diff <hash1> <hash2> 比较两个指定hash

• git rm <file> 删除文件,并添加到暂存区

  • -r <folder> 删除文件夹,并添加到暂存区
  • --cached 不真正删除文件，只将删除操作添加到暂存区

• git add 将变动添加到暂存区

  • git add <path> 添加指定路径的所有变动到暂存区, 在仓库根路径下执行git add . == git add --all
  • git add -A 添加所有变动到暂存区
  • git add -u 添加修改(modified)和删除(deleted)文件,不包括新(new)的文件
  • git add -i 交互式操作暂存区

提交

• git commit -m 'log' 提交暂存区的变动
  • git commit -am 'log' 添加已经在版本库控制的文件变动到暂存区,并提交
  • git commit --amend 修改最后一次commit (不会增加新的commit信息)

分支

分支基本操作

• git branch 查看本地分支
  • -r 查看远程分支
  • -a 查看所有分支
  • -m <新分支名> 修改分支名
  • -d/-D <分支名> 删除/强制删除 本地分支
• git branch <分支名> 创建新分支
• git checkout <分支名|Tag名> 切换到分支|Tag
  • -b <新分支名> 创建并切换到新分支

合并分支

• git merge <分支名> //把分支合并到本分支
  • --squash 不自动提交,用把分支的多个提交合成一个并添加到暂存区,需要手动commit。
  • --on-ff 可以快速合并的情况也添加合并日志,要配合-m使用
• git rebase <分支名> 衍和分支(分支衍合不会保留合并的日志，不留痕迹),相当于本地修改

提取commit

• git cherry-pick <commit hash> 将别的分支的一个commit拉到本分支

远程操作

源操作

• git remote -v 显示更详细的源信息
• git remote add <origin name> <GIT URL> 增加源
• git remote set-url <origin name> <GIT URL> 修改源
• git remote remove <origin name> 删除源

关联 推送

关联分支后 pull , push 等命令操作当前分支可省略 <origin>/<brnach>.

• git branch --set-upstream-to <brnach> <origin>/<brnach> 关联 本地与远程 分支

• git push -u <origin> <brnach> 推送并关联

• git push -f 强制用本地分支覆盖远程分支, 慎用

删除远程分支

• git push origin :<brnach> 删除本地分支后, 把空分支推送到远程分支，以删除远程端分支
• git push origin --delete <brnach> 删除远程分支git 1.7版本后支持

更新/同步

• git fetch 更新更程所有分支的信息,但不影响本地代码
  • git fetch -all 同步所有分支信息
  • git fetch -p 同步分支信息,分同步远程仓库分支,tag删除情况
• git pull 更新分支 git pull == git fetch + git merge
• git pull --rebase rebase方式合并

Tag

• git tag <tagname> 新建tag
• git tag -a <tagname> -m '说明' 新建带说明的完整tag
• git tag -d <tagname> 删除tag
• git push --tags 推送所有本地tag到远程仓库
• git push origin --delete tag <tagname> 删除远程端的tag 1.7
• git tag --sort="version:refname" 按版本号排序显示tag
• git tag --sort="version:refname" -l '*.*.*' 增加筛选

常规提交流程

• git status
• git diff 比较差异
• git add 1.txt 把文件添加到git的仓库管理系统中
• git add <文件夹> 把文件夹添加到git的仓库管理系统中
• git add --all 提交所有修改到暂存
• git rm 1.txt 把文件从git的仓库管理系统中移除
• git rm -r myFolder 把文件夹从git的仓库管理系统中移除
• git commit -m '说明' 提交到仓库(本地)
• git push 推送到仓库
• git push <主机名> <分支名> 推送到指定远程分支
• git push -u <主机名> <分支名> 推送并关联远程分支

简单提交流程

1. git pull 同步远程仓库到本地(非必须,如果远程有更新)
2. git add --all && git commit -m '提交说明' 添加所有修改并提交,
3. git push 推送到远程

日志

• git log
  • -p 提交的祥细内容
  • -p <file> 指定文件的提交日志
  • -n 查看最后n次提交的信息
  • --oneline 简要列出commit记录
• git blame <file> 以列表方式查看提交历史

撤消

• git reset <commit id> 清理暂存区，移动当分支的游标(HEAD)
• git reset HEAD <file>... 把暂存区的文件移出
• git checkout <path> 重新检出文件 (d)

• git clean 删除新增,还未add的文件

  • -n 预览要删除的文件和目录
  • -f 删除 文件，
  • -df 删除 文件 和 目录

• git reset --hard 还原所有文件修改到HEAD

• git reset --hard <哈希值> 回退到指定版本
• git reset --hard HEAD^ 回退到上一个commit
• git reset --hard HEAD~2 放弃本地所有修改，回退到上上个commit
• git reset --hard HEAD@{1} 放弃本地所有修改，回退到HEAD前一次指向的commit
  • git reflog 显示 HEAD 移动路径
• git reset --hard ORIG_HEAD 放弃本地所有修改，回退到上一次(合并等)操作前的版本

• git revert <commit id> 用一个新commit撤销commit操作，此次操作之前的commit都会被保留

本地跟踪忽略

• git update-index --assume-unchanged <path> 忽略跟踪
• git update-index --no-assume-unchanged <path> 恢复跟踪

列出文件状态

• git ls-files 列出所有已缓存的文件
  • -v 用小写显示被assume-unchanged的文件

嵌套仓库

• git submodule add <仓库地址> <路径> 添加嵌套仓库
• git submodule init 初始化嵌套仓库
• git submodule update 更新嵌套仓库

保存当前状态

• git stash 备份当前的工作区的内容，从最近的一次提交中读取相关内容，让工作区保证和上次提交的内容一致。同时，将当前的工作区内容保存到Git栈中。 可多次git stash
• git stash pop 从Git栈中读取最近一次保存的内容，恢复工作区的相关内容。
• git stash pop stash@{num} 如果有多个工作现场，num是工作现场的编号。使用pop命令恢复的工作现场，其对应的stash 在队列中删除。
• git stash apply stash@{num} 除了不在stash队列中删除外其他和git stash pop完全一样。
• git stash list 显示Git栈内的所有备份，可以利用这个列表来决定从那个地方恢复。
• git stash clear 清空Git栈。

取消版本控制

• git rm -r -n --cached <path>

git设置

• git config --global push.default current
• git config --global pull.default current

> mysql -uroot
> mysql -h127.0.0.1 -P3306 -uUsername -pPassword

常用参数

• -u 用户名
• -p 密码
• -h 服务器ip/域名
• -P 端口,默认3306

常用查看命令

• status; –显示当前状态
• show databases; –显示所有数据库
• select database(); –当前使用的数据库
• use databaseName; –更换使用的数据库
• show tables; –显示当前数据库的表
• show tables from databaseName; –显示指定数据库的表
• desc tableName; –显示表结构

用户/权限 操作

use mysql;

先进入mysql数据库方便操作

用户

查看用户

select host,user,password from user;

显示user表的host,user,password列

1
2
3
4
5
6
7
8
9
10
11

+-----------------------+------+-------------------------------------------+
| host                  | user | password                                  |
+-----------------------+------+-------------------------------------------+
| localhost             | root |                                           |
| localhost.localdomain | root |                                           |
| 127.0.0.1             | root |                                           |
| localhost             |      |                                           |
| localhost.localdomain |      |                                           |
| %                     | jira | *6BB4837EB74329105EE4568DDA7DC67ED2CA2AD9 |
| localhost             | jira |                                           |
+-----------------------+------+-------------------------------------------+

添加用户

create user new_user IDENTIFIED by 'xxxxx';

identified by 会将纯文本密码加密作为散列值存储
默认创建的是远程用户new_user@'%'
% 通配所有IP,localhost不是IP

create user new_user@localhost;

创建指定本地用户

修改用户

RENAME USER old_user TO new_user;
RENAME USER 'jeffrey'@'localhost' TO 'jeff'@'127.0.0.1';

mysql 5之后可以使用，之前需要使用update更新user表

更改密码

set password for root=password('xxxxxx');
set password for root@'%'=password('xxxxxx');
update mysql.user set password=password('xxxx') where user='root';

改可以直接修改user表中的记录

删除用户

drop user newuser;

mysql5之前删除用户时必须先使用revoke 删除用户权限，然后删除用户，mysql5之后drop 命令可以删除用户的同时删除用户的相关权限

权限

常用权限说明

• all 所有权限;
• select , update , delete , insert 普通表操作权限
• create , alter , drop 创建、修改、删除 数据表结构权限
• references 外键权限
• create temporary 临时表权限
• index 索引权限
• create view , show view 创建、查看视图权限
• create routine , alter routine , execute 创建,更改,执行存储过程权限
• lock tables 锁表
• create user 创建用户

常用角色权限

• 普通用户 grant select, insert, update, delete on testdb.* to test_user@'%'
• 普通开发人员 grant all on testdb to dev@localhost
• DBA grant all on *.* to dba@localhost

查看用户权限

show grants for jira;

1
2
3
4
5
6

+-----------------------------------------------------------------------------------------------------+
| Grants for jira@%                                                                                   |
+-----------------------------------------------------------------------------------------------------+
| GRANT USAGE ON *.* TO 'jira'@'%' IDENTIFIED BY PASSWORD '*6BB4837EB74329105EE4568DDA7DC67ED2CA2AD9' |
| GRANT ALL PRIVILEGES ON `jira`.* TO 'jira'@'%'                                                      |
+-----------------------------------------------------------------------------------------------------+

赋予权限

grant select ON dmc_db.* TO zx_root;
grant all ON dmc_db.* TO zx_root;

回收权限

revoke select on dmc_db.* from zx_root;

更新权限缓存

flush privileges ;

修改权限后,立即生效(更新权限缓存)

index_generator > order_by 改为 -top -date

1
2
3
4

index_generator:
  # path: ''
  # per_page: 10
  order_by: -top -date

使用

在文章的front-matter中增加top值, top值越大越靠前;

1
2
3
4
5
6
7
8

---
title: 置顶文章
date: 2017-06-07 19:23:39
tags:
categories:
top: 100
---
## 置顶文章

安装

1

npm install hexo-generator-feed --save

配置

hexo的_config.yml文件中，添加feed配置

1
2
3
4
5
6
7

feed: 
  #feed 类型 (atom/rss2)
  type: atom   
  #rss 路径
  path: /atom.xml  
  #在 rss 中最多生成的文章数(0显示所有)
  limit: 10

在主题目的_config.yml文件中，添加RSS配置

1

rss: /atom.xml

H1

H2

H3

H4

普通文本 , 斜体 , 加粗 , 行内代码 , 连接

1
2
3
4
5

//代码块
var abc = 123;
function fn(x){
return x;
}

!引用

居中引用

• 列表1
• 列表2
• 列表3
  • 列表3-1
  • 列表3-2
• 列表4

1. 列表1
2. 列表2
3. 列表3
   1. 列表3-1
   2. 列表3-2
4. 列表4