Practi'blog

发表于 更新于 本文字数： 1.3k 阅读时长 ≈ 1 分钟
  • string操作不改变原string，只会返回新string。Buffer只改变原Buffer。
  • bin => dup
1
2
var dup = new Buffer(bin.length);
bin.copy(dup);
  • 附件上传
1
2
3
4
5
6
7
8
9
10
11
12
const uploadFile = (req, res, next) => {
	//生成multiparty对象，并配置上传目标路径
	var form = new multiparty.Form({uploadDir: './public/files/'});
	//上传完成后处理
	form.parse(req, function(err, fields, files) {
		var inputFile = files.file[0].path;
		console.log('inputFile', inputFile);
		res.writeHead(200, {'content-type': 'text/plain;charset=utf-8'});
		res.end(inputFile);
		//res.end(util.inspect({files: inputFile}));
	});
};
  • 实现文件下载
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
router.get('/file/:fileName', function(req, res, next) {
	var fileName = req.params.fileName;
	var filePath = path.join(__dirname, fileName);
	var stats = fs.statSync(filePath);
	if(stats.isFile()){
		res.set({
			'Content-Type': 'application/octet-stream',
			'Content-Disposition': 'attachment; filename='+fileName,
			'Content-Length': stats.size
		});
		fs.createReadStream(filePath).pipe(res);
	} else {
		res.end(404);
	}
});

前端<a>标签加上download属性后就可以下载了

服务器操作

  • pm2 list
  • pm2 restart 1
  • pm2 start <path/to/app.js>

Yarn

  • yarn add [package]
  • yarn add [package]@[version]
  • yarn add [package]@[tag]
  • yarn upgrade [package]
  • yarn remove [package]
  • yarn install

发表于 更新于 本文字数： 2.3k 阅读时长 ≈ 2 分钟
  • Boolean && 变量
  • Boolean || 变量可以用来设置默认值，如果 user.name 是 undefined、null、0、’’（空字符串）或 false 等 falsy 值，name 将被设置为’Guest’。空值合并运算符（??）是一个逻辑运算符，当左侧的操作数为 null 或者 undefined 时，返回其右侧操作数，否则返回左侧操作数。
  • a.indexOf(b)a为字符串或者数组
  • a.toFixed(2)a类型为number，保留小数
  • toString()可以判断对象的类型。Object.prototype.toString.call(<value>)
  • -a可以将a转化为number类型
  • 正则表达式//gi，g表示全局搜索，i表示忽略大小写
  • js不支持负向零宽断言/(?<=Jack)Sprat/（ES2018后支持）
  • Math.floor()向下取整，Math.ceil()向上取整，Math.round()四舍五入。
  • arr.sort(func)：改变原数组。func返回值为负数则a,b顺序不变。（从小到大排序，则a<b并且返回负值，则返回a-b；从大到小排序，则a>b并且返回负值，则返回b-a）
  • reverse()改变原数组
  • substr() 方法返回一个字符串中从指定位置开始到指定字符数的字符。
    不改变原数组，字符串
    str.substr(start[, length])
  • Array.prototype.slice()
    String.prototype.slice()
    slice() 方法返回一个新的数组对象，这一对象是一个由 begin 和 end 决定的原数组的浅拷贝（包括 begin，不包括end）。原始数组不会被改变。
  • Array.prototype.splice(start[, deleteCount[, item1[, item2[, ...]]]])
    splice() 方法通过删除现有元素或者原地添加新的元素来修改数组,并以数组形式返回删除的元素。此方法会改变原数组。
  • Array.forEach(arguments, func())对非数组序列进行forEach处理
  • Array(<len>).fill(<value>) 填满数组
  • 数组操作： shift(),unshift(),pop(),push()。改变原数组。
  • Array.prototype.join(<string>)合并为字符串。String.prototype.split('')：返回分割成的数组。
  • this总是指向函数的直接调用者（而非间接调用者），在DOM事件中，this指向定义这个事件的DOM对象；
  • t=setTimeout(fun(), N毫秒);与clearTimeout(t)；t=setInterval();，clearInterval(t)；
  • async与await
1
2
3
4
5
6
var start = async function () {
	for (var i = 1; i <= 10; i++) {
		console.log(`当前是第${i}次等待..`);
		await sleep(1000);
	}
};
  • EventTarget.addEventListener()
  • e.preventDefault();
  • e.stopPropagation()阻止捕获或冒泡阶段中当前事件的进一步传播

对象处理

  • Object.keys(obj)得到对象的可枚举属性
  • delete Obj.prop删除对象属性
  • 字符串与对象的转换：JSON.stringify(json)； JSON.parse(string)。Array也是Object类型
  • 字符串变量d用作对象属性名：{ [d]: !this.state[d] }

作用域

  • if块级作用域在ES5与ES6中不同。用 let 或 const 声明是块级作用域：用一对花括号（一个代码块）创建出来的作用域
  • const a = func; 与function a(){}的变量提升方式不同；
  • for循环中let 与var i = 0，在函数中不同

精度：使用 64 位双精度浮点型来表示

0.1 和 0.2 在二进制中是无限循环小数

原型继承

  • 对象的constructor属性指向它的构造函数。对象的__proto__属性指向上一级的原型对象。构造函数的prototype等于其生成对象的getPrototypeOf（__proto__）。
  • 必须显式地设置原型才能确保动态的继承，将B设置为A的原型链: A.prototype = new B;
  • 将构造器B属性传给A作为A的自身属性
1
2
3
4
function A (a, b) {
	B.call(this, c, d);
	this.machine = mach || "";
}
  • A为函数：A.prototype={ constructor: A, __proto__: 基本prop }

Web APIs

  • 在chrome中加入断点：在源码中加入debugger。
  • 前端全局对象window，node.js全局对象global。全局对象可以用来设置全局变量window.abc
  • window.location获取当前页面网址信息，可进行页面跳转
  • fetch跨域加上{ mode: ‘no-cors’ },response类型为opaque，status为0。或者使用fetch-jsonp
  • 赋值localStorage.abc = string，数字存入localStorage后变为string
  • URLSearchParams
  • es6 array新方法

发表于 更新于 本文字数： 1.6k 阅读时长 ≈ 1 分钟

样式

  • border: 5px solid red;
  • margin: top left-right bottom;
  • display：inline-block;
  • cursor: point;
  • 设置边框阴影box-shadow: inset 0 0 2em blue;
1
2
3
4
5
6
7
8
9
10
11
12
13
/* 图文并排 */
.dom {
	background:url('/images.jpg') no-repeat;
	padding-left:
	width:
}

/* 输入框取消默认样式 */
.input {
  border: none;
  resize: none;
  outline: none; /* 输入框边框 */
}
  • inline元素设置高度： {display: inline-block;}再设置 width height
  • a {color: #000;} * 未被访问的链接 *
  • a:visited {color: #3ac1bd;} * 已被访问的链接 *
  • a:hover {color: #3ac1bd;} * 鼠标指针移动到链接上 *
  • a:active {color: #3ac1bd;}
  • a{ text-decoration: none; } 去掉链接的下划线

排版

  • position: relative - absolute;
  • 填满整个元素：父元素设置高度，子元素height: 100%
  • css度量运算calc(100% - 36px)
  • hover显示新元素
1
2
3
4
<parent>
	<child1/>
	<child2/>
</parent>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
.parent {
	position: relative;
	.child1, .child2 {
		height: 100px;
		width: 100px;
	}
	.child2 {
		display: none;
		background: rgba(230, 230, 230, 0.9);
	}
}
.parent:hover .child2 {
	display: block;
	position: absolute;
	top: 0;
	cursor: pointer;
}

对齐

  • margin: auto;

  • 水平对齐

    父元素中设置text-align: left | right | center | justify | inherit;

  • 垂直对齐：

    子元素为inline，table-cell或者inline-block时vertical-align: top | text-top | middle | bottom | text-bottom;table-cell与inline-block中middle显示不同

    block元素中的文字line-height设置为该元素height

Flex

  • 子元素的float、clear和vertical-align属性将失效。
  • flex-direction: row | row-reverse | column | column-reverse;
  • flex-flow: flex-direction | flex-wrap;
  • justify-content: flex-start | flex-end | center 水平对齐方式
  • align-items: flex-start | flex-end | center 垂直对齐方式
  • 多根轴线align-content: flex-start | flex-end | center | space-between | space-around | stretch;
  • 保留空白符white-space: normal|pre|nowrap|pre-wrap|pre-line|inherit;

Css单位

  • vh：屏幕比例。px:像素。em根据当前位置的字体大小。rem根元素的字体大小。

Css选择器

  • .class #id element
  • 直接子元素：>
  • 选择器之间,表示and

发表于 更新于 本文字数： 432 阅读时长 ≈ 1 分钟

进入项目文件根目录

git init将该文件夹加入git的管理之中， 并新建了一个.git/文件夹

新建.gitignore文件让git忽略不需要同步的文件夹/文件。

git add .将.目录——就是当前目录加入git暂存区域(staging area)。

git commit -m "first commit"将声明区的文件加入到本地仓库

git remote add origin git@github.com:ABCD.git添加远程仓库的路径，并命名为origin，git@ABCD.git为使用ssh协议同步，https://ABCD.git使用https协议同步。ssh同步需用额外的配置，但是之后不需要输入密码，而且安全性更高。https协议需要每次输入用户名和密码，想要省略输入密码，就需要明文保存在本地电脑上，安全性低。

git push -u origin master将本地仓库推送到名为origin的远程仓库的master分支（branch)

发表于 更新于 本文字数： 19 阅读时长 ≈ 1 分钟

创建博客，记录一些事，可能以后用得着。

0%