2020-04-28

Js之Promise

promise是什么？

promise是一个对象，对象和函数的区别就是对象可以保存状态，有3个状态分别是：等待态（默认）成功态失败态，函数不可以（闭包除外）
并未剥夺函数return的能力，因此无需层层传递callback，进行回调获取数据
代码风格，容易理解，便于维护
多个异步等待合并便于解决

ES6 原生提供了 Promise 对象。

阅读全文 >>

2019-12-16

总结2019，展望2020

2019年也接近尾声了，一直想写个总结，留坑已久，要么因为工作，要么因为个人还未想好要怎么写，直到现在，2020已来。

回顾2018

先看一眼2018年总结。

2018年终期望实现情况：

2018年接触到了很多新的开发语言，像Kotlin、Flutter、Electron等，19年除了使用Kotlin开发过项目写过App，使用Electron写过一个简单的音乐播放器（跟着教程写的）外，Flutter、Vue、TypeScript等基本都没有进展，Kotlin仍有像高阶函数、协程这样的硬骨头要啃。
2018年阅读技术软文的习惯，2019仍在延续，但相比18年，阅读量有所减少，现在更喜欢将所读到、动手实践（编程）得到知识，心得体会记录下来。

总结2019

工作上

总的来说，2019年，基本已经没有参与App的开发，主要的工作精力放在了Three.js引擎的开发和跟进维护，参与的项目有DC设计器引擎以及其衍生项目HW数字化3D引擎。接触Three.js快一年了，比起刚刚接触Three.js时一脸懵逼，现在已经好很多，很多的问题和需求已经可以独立开发。

年尾两个月开始转向Cesium 3D引擎的开发，此时又有了刚开始Three.js开发时的无力感。除了在之前Three.js引擎中积累的3D知识经验外，其他又踏上了从零学习之路，Cesium中很多新的知识都要自习。

2019年养成新的习惯，虽说开始也是被动的，但最终想来也是好的，那就是每周总结周报。我记录周报的习惯一般是现将之前未完成的罗列记录，新接到的需求也先纳入记录，待完成后标记完成。这样的好处就是可以帮助我们记录我们工作方向，那些急需完成，那些未完成，规划好时间，本周做不完的需要延续到次周，这样我们的目标便更加明确了。

个人技能提升

至于个人技能方面，2019，想了想，好像也没学习什么新的知识或涉及新的领域。说有提升，也是有的，2019虽说没参与公司App开发，但自己有需求或者巩固下Android知识不至于遗忘，还是会建一些demo级的App，主要是面向一些知识点或某个框架，今年新建的App全部采用了Kotlin开发，顺便提升下kotlin开发技能和运用。18年时接触过Flutter开发App，但今年却运用很少，在这方面提升甚微，希望2020年有所突破。

19年还有个比较大的提升就是培养自己多写文档，不止用于公司产品（引擎API文档），自己学习和积累都采用文档的形式记录下来。俗话说，好记性不如烂笔头。18年时，文档采用gitbook发布为电子书的形式，今年，改用vuepress(基于Node.js)发布线上文档，访问加载速度比gitbook更好。

知识在于积累，除了记录学习笔记外，我还建了两个面经库（Android 面经库、前端面经库），旨在记录平时阅读时、工作中遇到的问题及解决方案。

年末双12购入自己朝思暮想第一个域名（sogrey.top）（真心图便宜），用于绑定我的github pages。

存在不足

虽然接触Three.js快一年了，实现公司引擎业务也不想起初那样技穷。但直到现在也没有彻底把Three.js系统化的理一遍，一直都是有了需求采取研究寻找解决方案，处于被动。期间只简单整理了些（Three.js-start）。
切入Cesium，虽然仍是需求驱动，但是这次并不像学习Three.js一样，只学习和了解了需求中遇到的方面，闲余时间查阅了很多系列教程、博客、视频，列出一个很简陋的学习路线和框架（Cesium 入门），自己根据这样的一个路线学习。现在仍有两三个大的核心的还没有做深入学习，处于空白。即使学习了解过得知识也不一定理解的很透彻。
2019年总起说起来有些懒散了，除了最后两个月学习Cesium时认认真真的查阅资料学习整理外，其他记录笔记很少，Three.js也有记录但更新频率很低，毕竟有的知识慢慢熟悉起来也觉得懒得记录了，后面遇到问题明明记得看到过却想不起来，想查阅却没有东西可查。

展望2020

工作方面

参与Cesium引擎开发，仍需很多东西要学，总是觉得没有方向，刚确定一个比较粗略的路线想系统的学习一下。由于是团队开发，而我们各自开发某个模块，我先采用插件式开发，开发时可脱离主API，开发完成或成型时在引入调用。学无止境，我把学习中遇到的好的资源、教程、博客、开源项目、资源收录在一起，共享学习资料。希望新的一年，站在这些巨人肩上能有更高的拔升。

Three.js引擎，仍有新的需求，比如同一个页面展示多个canvas用来展示多个场景，并且每个不相互干扰，这是个新的方向，可能会对之前引擎大改。

至于对于公司的工作建议或其他建议：

需求明确化。需求是产品的前提，在做产品时第一步就是要明确需求，这样的产品才不会脱离方向。做App最不想听到的是照5D BIM平台功能做个5D BIM App出来。可以做，要做成什么样，使用什么样的主题，哪些功能能在App上比较实用，而哪些并不实用，实现以什么样的方式实现，有没有相关的设计样例图例，这些都是需求。
周报制度继续沿用。为了有效推进公司各项管理工作，进一步发挥管理部门职能作用，加强信息沟通与交流，便于公司领导了解主要工作进展情况。这些说起来很大，往小了说，便于自己明确自己的工作重心及工作内容，发现自己的不足，防止跑偏。每周我们都有自己的开发内容，也有不定期不定时新来的需求，先把它们一一列队，编好轻重缓急标识，再去一一攻克解决他们。
适当一些培训。不论是技术还是产品，适当的一些培训也好让员工了解自己公司的产品，以及提出好的意见，商务向客户推荐我们产品更有底气，开发对于产品有了更深的了解，开发起来也更顺手。不用再一个人埋头琢磨（经常性打扰别人自己也觉得不好意思了）。

个人方面

考取驾照。

至于新知识的学习和巩固提升：

移动开发kotlin、flutter、以及组件化、MVP等都是提升目标，列在计划。
引擎开发，Three.js和Cesium，尤其是Cesium要学习的很多。
继续维护Android 面经库和前端面经库，并完善Cesium 入门，完善Cesium知识提升应用能力。
入手ECMAScript 6、webpack（Anguler、vue）、TypeScript

总结现在，着眼未来！做更好的自己，成为公司期望的优秀成员！2020年，希望一切都好，继续努力。

2019-12-04

使用hugo搭建个人博客

之前使用Hexo(https://sogrey.github.io/ github)和jekyll(http://sogrey.gitee.io/ gitee(私有仓库))搭建过个人博客，这次选择Hugo试试。

阅读全文 >>

2019-10-30

Android Studio开发组件化App遇到的问题

由于项目需求，需要开发组件化App，开发过程中遇到些问题，特此记录，以防再遇。

Q1 Compilation is not supported for following modules

Compilation is not supported for following modules: module1, module2, module3. Unfortunately you can’t have non-Gradle Java modules and Android-Gradle modules in one project.

提示以上信息，当然其中的module1, module2, module3是我举例，实际会报告项目中的mudule的名字。

Solution 1

Then you should go to File -> Invalidate Caches / Restart -> Invalidate Caches & Restart.

Then try to build the application again.

Solution 2

Click on the button:Sync Project with Gradle Files

Solution 3 (helpful for me)

1- close the project

2- close Android Studio IDE

3- delete the .idea directory

4- delete all .iml files

5- open Android Studio IDE and import the project

阅读全文 >>

2019-04-22

git clone 解决Permission Denied (publickey)问题

本地git bash 使用git clone git@github.com:***.git方式下载github代码至本地时需要依赖ssh key，遇到权限不足问题时一般都是SSH key失效或者SSH key不存在，重新创建SSH key一般就可以解决问题；

阅读全文 >>

2019-03-22

node.js调试

一般我们在调试javascript代码时常用的调试方法有：console日志和借助浏览器断点调试。

今遇到要调试node.js。Nodejs提供了一个内建调试器来帮助开发者调试应用程序。想要开启调试器我们需要在代码中加入debugger标签，当Nodejs执行到debugger标签时会自动暂停（debugger标签相当于在代码中开启一个断点）。

先看下几个命令的说明：

Stepping

cont, c - Continue execution 继续执行,直到遇到下一个断点
next, n - Step next 单步执行
step, s - Step in 单步执行并进入函数
out, o - Step out 从函数中步出
pause - Pause running code (like pause button in Developer Tools)

Breakpoints

setBreakpoint(), sb() - Set breakpoint on current line 当前行设置断点
setBreakpoint(line), sb(line) - Set breakpoint on specific line 在特定行上设置断点
setBreakpoint('fn()'), sb(...) - Set breakpoint on a first statement in functions body 在函数f的第一行设置断点
setBreakpoint('script.js', 1), sb(...) - Set breakpoint on first line of script.js 在 script.js 的第20行设置断点
clearBreakpoint('script.js', 1), cb(...) - Clear breakpoint in script.js on line 1 清除断点

Information

backtrace, bt - Print backtrace of current execution frame 显示当前的调用栈
list(5) - List scripts source code with 5 line context (5 lines before and after) 显示当前执行到的前后5行代码
watch(expr) - Add expression to watch list 把表达式 expr 加入监视列表
unwatch(expr) - Remove expression from watch list 把表达式 expr 从监视列表移除
watchers - List all watchers and their values (automatically listed on each breakpoint) 显示监视列表中所有的表达式和值
repl - Open debugger’s repl for evaluation in debugging script’s context 在当前上下文打开即时求值环境
exec expr - Execute an expression in debugging script’s context 在调试脚本的上下文中执行表达式

Execution control

run - Run script (automatically runs on debugger’s start) 执行脚本,在第一行暂停
restart - Restart script 重新执行脚本
kill - Kill script 终止当前执行的脚本

Various

scripts - List all loaded scripts 显示当前已加载的所有脚本
version - Display V8’s version 显示v8版本

参考网站：https://nodejs.org/api/debugger.html

https://www.cnblogs.com/axl234/p/6504336.htm

2019-03-19

端口被占用，干掉它

这个问题遇到过好几次，起初是在开发Android是adb端口被占用，就连360都曾占用过；特此记录：

这次是 35729 被占用了，看操作：

1 . 查看占用端口的进程PID

1	netstat -ano\|findstr 35729 # 35729是我这边被占用的端口，你根据自己的情况下而定。

输出如下：

E:\workspace\VSCode\three.js\Three.js-start (master -> origin)
λ netstat -ano|findstr 35729
  TCP    0.0.0.0:35729          0.0.0.0:0              LISTENING       8084
  TCP    [::]:35729             [::]:0                 LISTENING       8084
  TCP    [::1]:10082            [::1]:35729            ESTABLISHED     10804
  TCP    [::1]:35729            [::1]:10082            ESTABLISHED     8084

2 . 看到 35729 端口的 PID 是 8084,通过PID查看所有进程,看看谁在作祟

1	tasklist /fi "PID eq 8084"

E:\workspace\VSCode\three.js\Three.js-start (master -> origin)
λ tasklist /fi "PID eq 8084"

映像名称                       PID 会话名              会话#       内存使用
========================= ======== ================ =========== ============
node.exe                     8084  Console                    1     98,516 K

3 . PID，干掉它：

1	taskkill /pid 8084 /f

1
2
3

E:\workspace\VSCode\three.js\Three.js-start (master -> origin)
λ taskkill /pid 8084 /f
成功: 已终止 PID 为 8084 的进程。

完工。

最初发布在 http://blog.sina.com.cn/s/blog_694394d30102wgxg.html

2019-03-18

JS中apply()与call()的区别

JavaScript中的每一个Function对象都有一个apply()方法和一个call()方法，它们的语法分别为：

/*apply()方法*/
function.apply(thisObj[, argArray])

/*call()方法*/
function.call(thisObj[, arg1[, arg2[, [,...argN]]]]);

阅读全文 >>

2019-03-15

前端调试之把玩console

Console 对象用于 JavaScript 调试。

JavaScript 原生中默认是没有 Console 对象,这是宿主对象（也就是游览器）提供的内置对象。用于访问调试控制台, 在不同的浏览器里效果可能不同。

Console 对象常见的两个用途：

显示网页代码运行时的错误信息。
提供了一个命令行接口，用来与网页代码互动。

阅读全文 >>

2019-03-14

下载神器 you-get

在windows 上：

1 安装

从https://github.com/soimort/you-get/releases/latest下载，解压后在cmd中切换至目录下执行you-get即可

安装python,执行

1
2
3

$ pip3 install you-get #安装
$ pip3 install --upgrade you-get #更新
$ pip3 install --upgrade git+https://github.com/soimort/you-get@develop #更新

https://you-get.org/

github

下载ffmpeg从ffmpeg.org并添加到PATH

2 用法

Usage: you-get [OPTION]... [URL]...

Startup options:
    -V | --version                      版本信息
    -h | --help                         帮助
    
Dry-run options: (no actual downloading)
    -i | --info                         列出所有可获取的视频信息
    -u | --url                          打印URLs的提取出信息，真实链接地址
         --json                         打印URLs的JSON格式
    
Download options:
    -n | --no-merge                     不合并分片
         --no-caption                   不下载其他文件（字幕，歌词，弹幕。。。）
    -f | --force                        覆盖存在的文件
    -F | --format <STREAM_ID>           选择下载那种清晰度的视频
    -O | --output-filename <FILE>       设置输出文件名
    -o | --output-dir <PATH>            输出文件夹（相对位置可用，如：~/video/）
    -p | --player <PLAYER [OPTIONS]>    将提取出的真实地址传给播放器
    -c | --cookies <COOKIES_FILE>       导入cookies.txt或cookies.sqlite（firefox下使用export-cookies插件）
    -x | --http-proxy <HOST:PORT>       使用HTTP代理下载
    -y | --extractor-proxy <HOST:PORT>  仅对真实地址视频文件的下载使用HTTP代理
         --no-proxy                     不使用代理
    -s | --socks-proxy <HOST:PORT>      使用SOCKS5协议代理
    -t | --timeout <SECONDS>            设置代理的timeout
    -d | --debug                        显示traceback和其他的debug信息
    -I | --input-file                   仅下载链接的视频不下载列表

3 注意

默认情况下，下载最高清晰度视频
输入任意内容如：you-get “i love china” 可以从Google内搜索并下载视频，youtube-dl也有类似功能
bug地址：https://github.com/soimort/you-get/issues
-c和-p参数非常好用