一些angular/js/ts的坑和吐槽

------20190318 -------------

回头看，很多槽点已经随着升级改掉了

 

绑定string字面值到子组件@Input

<app-overlay-static [name]="'marsh'"></app-overlay-static>

双引号+单引号。表示string的字面值。

不常用，因为通常是父组件遍历自己的属性，或者传自己的属性给子组件

更常见的是：只有双引号：

[子组件@input] = 父组件的属性

 

#--------------------------------------------------------------

周末想随便写点前端。以前确实没正经写过，但是好歹写过几笔。本来以为没啥难度，结果没想到细节充满蘑菇，哦，不对，魔鬼。

几乎是寸步难行吧，体验极差，简直怀疑自己老了，撸不动代码了。

让我感觉到了原始人突然进入现代世界后，感觉到的满满恶意。

这充分说明，工程问题是个时间积累过程，会者不难，难者不会。

一个陌生的技术领域，哪怕对老手来说再容易，但只要你本人没做过，就不得不去从最简单的“各种问题”一点点地笨拙地学习。

当年难倒我起步学电脑的，都不是键盘指法，也不是记命令和关键词，而是不会开、关机、不会进GUI。（包括：找不到开始菜单，不会关win8; linux下不会退出vi）

面对各种电器、遥控器，哪怕再简单，不认真看说明书，就是点不亮 ，玩不转。

——就好像不会念咒语，魔法就不会生效一样。

angular 的接口变化太多，太快

1年前，好像只是ng2，现在莫名其妙都6了，当时我感觉文档啊，接口啊还都可以（因为angularJS 没用过）。

结果现在又变出各种花样。

几个问题：

1 不让console.log()

解决：在tslint.json里 有个“no-console”字段，把里面的true改成false

2 不让git push

说是 stylelint  不知道如何处理scss。结果直接报错，无法和remote同步，这什么鬼！

　　这个问题坑了我半天，各种尝试stylelint git 各种关键词搜索，都搞不定，最后自己发现：

　　在package.json里 ：“scripts” 有一行“prepush”:“npm run lit:ci” 删除掉就OK。

老子没工夫为所谓的语法规范问题多费脑子，TM明明能运行也不报错，不让我提交git什么鬼。

我写后端都没这么变态，都是提交了代码，然后ci去运行ut，没听说不让提交的，前端嚣张什么，删了。

3 Http 还是 HttpClient？

想写一个读mock json数据的service。官网Hero那个不是太明白

网上很多文档 写的是

       import { HttpModule } from '@angular/http';

　

但其实 现在是

XX.module.ts里

     import { HttpClientModule } from '@angular/common/http';
    .....
     imports: [
     HttpClientModule,]

然后YY>service.ts是

import { HttpClient } from '@angular/common/http';
....
export class ZZZService {
  this.list_data;
  constructor(private http: HttpClient) {
    this.http.get('assets/mock-data/mock.json').subscribe(
      data => {
        this.list_data = data;
        // console.log(data);
      });

  }

要注意，http.get 返回的是个observable对象，后面必须subscribe 里面写data=>{} 这种回调函数。

吐槽：

1 两个不同地方都要import类似的东西，但名字还不一样，一点都不SPOT。

2 constructor里参数列表 要塞进这个类型的东西。以上种种，极大抵消了DI的所谓优势。也就是构造函数调用，传入http对象这步省了点。

angular-cli.json ->angular.json

这个没什么可说的，猜出来的。

总的感觉ng2之后的接口还是不太稳定，直接导致网上的文档，提问回答不是太能满足需要。尤其是对我这种不一直关注前端的新手。

真是觉得接口变化太快的玩意，学起来量力而行吧，贬值太快，真有点M$的风范。

真不如python和lisp（只要不涉及macro和不同方言的语法糖）。

唯一感觉到正面的变化是，创建component和service，现在是通过命令行cli替你生成那些一堆堆废话代码文件和命名：

ng generate component heroes
ng generate service hero

感觉稍微好一点。

但我还是不喜欢这种到处是各种配置文件，各种文件命名规范（动不动lint就报错），到处修修补补的写法。

在ts中引用js模块

主流的热门的，可以 npm install @types/XX

然后才可以 import * as XX from ‘XX’

非主流的js模块，得自己写.d.ts文件，声明各种到处类型。有个typings 但没用起来。遇到那种只有一个min.js的，没法弄，放弃吧。

js的Date  月份从0开始

明明 构造函数是 new Date(XX,XX,XX)这种样子，谁TM能想到 月份居然是 0-11。

没想到还真是个话题，2018年2月，JS之父Brendan Eich就提过这件事，「去怪Java」这话也是Brendan自己说的。

https://www.zhihu.com/question/263804983

好吧。。。反正在python里，且不说pendulum arrow这些，就TM自带的datetime也不知高到哪里去了。

——还有些小坑，就懒得写了。

总得感觉：

1 前端技术发展快，同样的功能，实现方式多样，各种库太多。 但是质量低，稳定性差。很难说哪个是坑，哪个不是。

2 即使有框架支持，但是写程序时感觉注意力十分破碎，十分不爽。要到处改各种配置文件（tsXXX.json好几个，其他.json好几个，XX.ts还有好几个，每个component也是一样，还要不时在module里加几句），然后各种坑，各种库，官方文档不够看，完全离不了Google StackOverflow 。

感觉注意力不集中，比刷微博，刷朋友圈感觉还破碎。没有写其他代码时那种专心，安静，很容易进入“心流”的感觉，十分不舒服。

修修补补，一句一句地堆代码。如果说同样是往屎山上抛屎，写后端的感觉是整坨整坨自己拉，写前端是要不断换各种开塞露和其他各种工具，然后东拉一点，西拉一点（.ts .js .json  .html .css）。

3 各种固定搭配式的需要记忆的配置，和互相关联的改动点（简单import个东西都要改好几处），适合记忆力好，耐心好的女生。“互联网的性别是女性”，我服，特指前端。

4 写出来的代码imperative式硬堆出来的更多些，而且确实，不就是个界面嘛，与其精心设计，还不如硬堆出来完事。

5 异步啊，响应时间啊，css外观 这些非功能需求，我根本不在乎。没必要纠结这些。

6 既然技术本身都不稳定，也不值得我多费心思了。

前端有个ts，angular这样的框架在类型检查，封装隔离方面起点辅助作用，保证不出大错（没有全局变量，全局作用域，好多了）。

这就够了，把后端写好，前端本着"拥抱变化，撸完即扔"的心态，凑合着撸撸就完了。

写前端的唯一优点：

1 治愈求完美的强迫症。

2 所写即所见，各种花花绿绿的界面效果，可以满足打动作游戏一样的廉价成就感。