hxrelam's Blog

2017-06-25发表技术随记3 分钟读完 (大约427个字)

字母数字排序的 sortX 的实现

昨天和一个刚刚转前端的朋友聊天时，他说之前面试时有道 javascript 排序题思路不是很清楚，让我把这道题详细的讲解一下。本文主要是记录我的实现方法，欢迎大家一起讨论，如有更好的方法请给我留言。

题目如下

给定一个只包含大写字母和数字且无重复元素的混合数组，按照以下要求排序

字母按在字母表中的位置和数字从小到大排序
字母优先排在前面

例如：

sortX 为该方法，则执行 sortX([“1”, “A”, “B”, “4”, “E”, “C”, “6”, “7”]);

结果为：["A", "1", "B", "C", "4", "E", "6", "7"]

2017-06-22发表工作随记3 分钟读完 (大约421个字)

如何正确的提交本地仓库到远程仓库

背景

初始化一个本地仓库并添加一个新文件（README.md），然后将本地仓库上传。

先 pull，因为两个项目不同，发现refusing to merge unrelated histories，无法合并。

注：查看解决方法，请直接跳过操作过程。

操作过程

新建项目并初始化

1
2
3

mkdir -p learning/test // 新建一个项目目录
cd learning/test // 进入项目目录
git init // 初始化仓库

关联远程仓库

1	git remote add origin https://git.oschina.net/hxrealm/test.git

查看仓库地址

1
2
3

$ git remote -v
origin https://git.oschina.net/hxrealm/test.git (fetch)
origin https://git.oschina.net/hxrealm/test.git (push)

2017-06-19发表技术随记3 分钟读完 (大约510个字)

LazyMan 的实现

LazyMan 是一道 javascript 面试题，第一次听说 LazyMan 一词是与ing70聊天中获得，本文主要是说说自己的实现思路和方法。

题目如下

实现一个 LazyMan，可以按照以下方式调用:

LazyMan("Hank")输出:
Hi! This is Hank!

LazyMan("Hank").sleep(10).eat("dinner")输出
Hi! This is Hank!
//等待10秒..
Wake up after 10
Eat dinner~

LazyMan("Hank").eat("dinner").eat("supper")输出
Hi This is Hank!
Eat dinner~
Eat supper~

LazyMan("Hank").sleepFirst(5).eat("supper")输出
//等待5秒
Wake up after 5
Hi This is Hank!
Eat supper

以此类推。

分析思路

根据经验猜测此题可参考 jQuery 中delay()、PHP 中sleep()、Express中 next()中间件等方法的实现原理。也是典型的 JavaScript 流程控制，因此问题的关键是如何实现任务的顺序执行。

2017-06-12发表技术随记4 分钟读完 (大约590个字)

chartJs 在项目应用中的一些总结

Chart.js 是一款流行的 javascript 图表库，基于 HTML5 Canvas 开发，具有简单、灵活、兼容主流浏览器等特性。

本文主要是对新版 Chart.js (v2.0+)在项目应用中的一些小总结，请特别注意目前国内翻译的 Chart.js 中文版本相对比较旧，大家在使用过程中请注意，在此推荐查看 Chart.js 官网。

官方版本

Chart.js

中文版本

下面主要记录 Chart.js 在实际项目应用场景中的一些设置，主要以问答方式体现如下：

1、如何设置线条大小、颜色？

data: {
 labels: "labels",
 datasets: [{
  label:'',
  data,
  borderWidth: 2, // 线条宽度
  borderColor:'rgba(255,255,255,.6)', // 线条颜色
  backgroundColor:'rgba(255,255,255,.2)', // 线条到坐标区域背景色
 }]
}