优雅编程

优雅编程

工具约束产出高质量编程

面向对象到组件化的前端演进之路

组件该如何阻止才能高效的为技术怨怼提效

形成自己的技术思考闭环

Eslint(js语法检测)

CssLint(CSS语法检测)

写法规范

position写在最上面 left right

接下来 就是 width height

在 padding margin

最后 背景和颜色 文字

命名规范

英文单词或者词组组成

vscode的 code spell check 代码单词检测插件 提升代码质量的插件

codeReview 代码校验

分享代码 进行提升自我

Jest

自动化测试工具

注释、目录组织

不推荐所有的css文件放在一起 页面文件放在一起的做法

因为此时有一个页面出现问题 你要去另外一个页面进行查找

基于组件或者功能进行目录的划分 找到相应的组件进行划分

好的代码真的不需要过多的注释 名字要起的好

代码要写的精细

#####注意

代码规范只能解决表面的问题 组件化才是核心

组件

组件是页面的一部分 将页面的一部分拆离出去

模块不一定是页面的一部分

组件的粒度 代码的拆分 让代码更加的简单

面向过程编码

就是堆代码 想到什么写什么 然后将函数拆离出来

代码函数拆分的很漂亮 还是不好进行阅读与及维护 一个页面几千行的js文件

#####面向对象编程

构造函数进行编程

当new一个类的时候 就会执行构造函数 this.init() 一步一步的往下编程，完成你想要做的事情

ppt 和代码看看

看他的面向对象的编程

将代码进行拆分 js代码的拆分

拆分的原则是 一个对象就是一个组件 拆分

看他的代码

面向对象的套路

有init、render、bindEvent

面向对象代码的升级版

面向对象 前端处理复杂的东西

组件如何拆

组件的大小 根据行数进行拆分 组件小一点 便于管理

vuex和redux要深入理解

组件间的通信 数据统一管理 所有的数据都放在vuex里面进行管理

数据放在store 或者vuex进行管理

数据管理

都放在store进行管理 就会出现 性能问题 vue不会出现 redux会出现

通用组件

拆分问题 粒度的问题 通用组件不要太大

ui与逻辑的隔离

形成自己的技术思考闭环

在一个地方不断的提升自己 取决自己 努力的逼迫自己去学习

技术是支持 业务是基本点

你做的慢公司没开了你 你是欠公司的人情 你需要努力的提升自己

技术能力的沉淀与输出 去写组件库 让别人写的更快

造轮子的问题等 你要更多的输出

没事干的时候 也要去做 去沉淀一些东西

知识储备和思维广度要兼备

下了班之后 就开始学习一些东西 提升自己

和产品经理沟通 讲清楚需求

《谈判》书籍去看一下

形成自己的影响力

去开源去实现一些新的东西 强者恒强

每天保持3个小时的学习时间

上班就是好好的工作 下班就好好的学习 如何睡得少又可以有特别的有精神

算法还是要学的