2018.10.17-18 LOG：indexdb websocket git-alias css-sprite console Object

昨天的事很多，上午是前个项目尾款的催收，晚上又和朋友吃饭聊天，中午还买了个冰箱。晚上回来10点过了。

珍惜生命，远离外包。昨年接了两个外包项目，这两月找KH要个尾款像要他们命一样。

没有预算好费用就不要找人做，OK？

家里冰箱用了有些年头了，换一个，多装些好吃滴。

不废话了，进入正题，这两天学习日志如下

indexdb
websocket
git-alias
css样式分离
css-sprite
git协议
git 文件命令
console的用法，Object相关知识

indexDB

在web的领域没有先来后到的说法，前些年很多人研究的web sql也成功被W3C抛弃，indexDB后来居上，又因为它很好的封装对象，又能在webworker中使用，注定会被更多的浏览器支持。如果你想存储一些容量大一点的数据，又不想去构建数据库，用这个没错。

关键字：键值对存储、异步、支持事务、支持二进制数据、容量无上限，不能跨域
open：打开链接
success：链接成功
upgradeneeded：数据库升级事件，第一次会调用，新建表
error：接收错误信息
操作：add，delete，put，openCursor，注意是通过指针遍历数据

可以参看张鑫旭和阮一峰的博客，写的很详细，张的还有在线案例

websocket

如果你不想客户端频繁的去轮询服务器，也不想某些客户端资源耗费太快，用websocket就对了。一次牵手，情定终生， 除非某一方主动跑路。

仍然建立在TCP之上（这句话貌似多余了，难道会用UDP）
除了请求通信方式和协议标识符和HTTP不一样，其他基本差不多，不一样的地方估计你一辈子也用不到
open,close,message,send，主要的函数大概就这些，很简单
阮老师推荐的一个WebSocket服务器，websocketd，将任何正常的语言文件变为websocket服务，强大吧。

git alias

懒人可以看过来了，修改根目录下的.gitconfig，可以配置命令别名，不知道怎么进根目录的请无视以下内容。

git config --global alias.ci commit，commit设为ci，是不是方便了很多？
直接修改根目录.gitconfig，加入别名配置

[alias]
        ci = commit
        st = status -sb
        ad = add .
        hi = log --pretty=format:'%h %ad | %s%d [%an]' --graph --date=format:'%Y-%m-%d %H:%M:%S'

CSS样式分离

今天看了张鑫旭在10年写的一篇文章，主讲样式的命名写法，叫做《CSS样式的分离再分离》,他提倡根据UI设计，将项目一些通用的CSS，按单属性来定义罗列，这样可以提高重用，减少CSS代码。
什么意思？.div-left{padding:5px;text-align:right;}----->.pd{padding:5px;} .tr{text-align:right;}
这样就可以到处复用，他还给出了一个通用库，密密麻麻一大篇。
我是觉得哈，这样子CSS可能是舒服了，但HTML可就不同意了，是吧？
还有，现在不是有预处理么？当然他是10年写的。。

css sprites

精灵兔还是雪碧兔？不要觉得对一个单词用不同的翻译就高大上，那是虚荣心。
不知道精灵图怎么定位的，不懂位置上有负数的，去研究一下background-position。
这玩意儿出来很久了吧，我记得6，7年前就开始用了，但我也一直不是很感冒。除了能够优化首次和修改后的图片的加载，平时大部分时候是没用的，浏览器会缓存我们的图片。我只能说看情况使用。
背景图是能减少请求，但也不要到处都是背景图，该是内容的还要内容，否则怎么语义化，你叫盲人怎么用？

git协议 git文件操作

git支持的协议有很多，主要有git，http，ssh。git主要用于本地文件服务器，一般很少使用。http和https在windows上使用比较广泛，但速度比较慢。还是建议不管什么操作系统都用ssh，不会用的可以自己百度。
git提供了很多文件操作，平时都没怎么用过，今天看了一下，还是比较方便。

git clean,-n 查看暂存区的文件；-f 删除暂存区所有文件，相当于回退；-x 删除暂存区所有文件包括ignore包括的文件。
git rm,git mv等操作可以直接操作文件，操作后不需要add。
git add -p，这个可以让你选择一个文件里需要提交的内容，其实除了在特殊情况下，其余时候不建议使用，只提交部分内容，呵呵，等几天你自己可能都不记得了，还不要说团队其他人了。

console用法

看了阮老师的console才知道用法这么多，孤陋寡闻了。

支持占位符 console.log(' %s + %s = %s', 1, 1, 2)
直接输出错误 console.error('Error: %s (%i)', 'Server is not responding', 500)
对象转表格：console.table()
方法计数：console.count()
断言：console.assert()
程序计时：console.time(),console.timeEnd()
以上内容参考阮一峰javascript教程

Object对象

作为工具函数，转换为对象
作为构造函数，生成对象
静态方法：Object.keys,Object.getOwnPropertyNames
实例方法：valueOf,toStrting,toLocalString,hasOwnProperty
toString：可用来判断数据类型 Object.prototype.toString.call(value)
属性描述对象：

{
  value: 123,  //值
  writable: false,  //是否可改变
  enumerable: true,//是否可遍历
  configurable: false,//是否可配置
  get: undefined,//属性取值
  set: undefined //属性赋值
}

var obj = { p: 'a' };

Object.getOwnPropertyDescriptor(obj, 'p')  //获取属性描述
// Object { value: "a",
//   writable: true,
//   enumerable: true,
//   configurable: true
// }

//定义属性
var obj = Object.defineProperties({}, {
  p1: { value: 123, enumerable: true },
  p2: { value: 'abc', enumerable: true },
  p3: { get: function () { return this.p1 + this.p2 },
    enumerable:true,
    configurable:true
  }
});
obj.p1 // 123
obj.p2 // "abc"
obj.p3 // "123abc"