05.产品前端架构

第1章--协作流程

WEB系统

角色定义

协作流程

职责说明

第2章--接口设计

概述

接口规范

规范应用

本地开发

第3章--版本管理

见 Java开发工程师(Web方向) - 01.Java Web开发入门 - 第5章.Git

课堂交流区：

分布式版本控制(DVCS) 对比集中式版本控制系统(CVCS)

由于Git的持续火热， 对于DVCS与CVCS的争论和对比越来越多了， 似乎很多文章都倾向于这个观点： "Git这种DVCS 要比SVN这些CVCS要优越"    实际情况真的是这样吗？ 现在请同学们各抒己见， 以各个方面来分析下CVCS与 DVCS之间的优缺点. 

答：

http://scmquest.com/centralized-vs-distributed-version-control-systems/ https://stackoverflow.com/questions/111031/comparison-between-centralized-and-distributed-version-control-systems https://www.youtube.com/watch?v=_yQlKEq-Ueg

为什么大部分情况下，git fetch 要优于直接使用 git pull?

不难发现， 课程中对于可能常用的 git pull 命令着墨不多.  而把大量的时间放在了 git fetch + git merge 的工作原理上。  

同学可以总结下，为何使用git fetch来分步骤处理 要优于直接使用git pull？ 

答：

git pull的问题是它把过程的细节都隐藏了起来，以至于你不用去了解git中各种类型分支的区别和使用方法。当然，多数时候这是没问题的，但一旦代码有问题，你很难找到出错的地方。

将下载（fetch）和合并（merge）放到一个命令里的另外一个弊端是，你的本地工作目录在未经确认的情况下就会被远程分支更新。当然，除非你关闭所有的安全选项，否则git pull在你本地工作目录还不至于造成不可挽回的损失，但很多时候我们宁愿做的慢一些，也不愿意返工重来。

前面那些行显示出“git fetch”命令会将哪些文件下载到本地，这些文件一旦下载到本地之后，就可以在本地进行任意操作了。

git fetch命令执行完毕之后，还不会立即将下载的文件合并到你当前工作目录里，这就给你了一个选择下一步操作的机会，要是想将从远程分支下载的文件更新到你的工作目录里，你需要执行一个“合并（merge）”操作。

单独进行下载和合并是一个好的做法，你可以先看看下载的是什么，然后再决定是否和本地代码合并。而且分开来做，可以清晰的区别开本地分支和远程分支，方便选择使用。

版本管理的单元测验

本次得分为： 19.00/19.00, 本次测试的提交时间为： 2017-09-12 1 单选(2分)

下列哪个工具不是版本控制系统

A.SVNB.RCSC.GITD.FTP2.00/2.00 2 多选(3分)

以下哪些git命令可以切换branch

A.git reset <branchName>B.git checkout –b <branchName>1.50/3.00C.git branch  <branchName>D.git checkout  <branchName>1.50/3.00 3 多选(3分)

以下哪些git命令可以得到一个git仓库

A.git init1.50/3.00B.git clone1.50/3.00C.git checkoutD.git pull 4 多选(3分)

以下哪些git config命令可以影响到本用户所有git操作

A.git config --global1.50/3.00B.git config --localC.git config --highD.git config --system1.50/3.00 5 判断(2分)

与svn类似，只要使用git commit可以提交你的代码与其它开发者共享

A.×2.00/2.00B.√ 6 判断(2分)

git pull除了会直接获取远程历史，还会与你本地版本的历史进行合并

A.×B.√2.00/2.00 7 判断(2分)

git alias 可以用来设置git命令的别名

A.√B.×2.00/2.00 8 判断(2分)

git checkout 和 git reset 都可以使HEAD指向发生改变

A.×B.√2.00/2.00

 

 

第4章--技术选型

模块化

The secret to building large apps is never build large apps. Break your applications into small pieces. Then, assemble those testable, bite-sized pieces into your big application. -- Justin Meyer

语言的模块支持：

java: import

c#: using

css: @import

javascript: none!

模块：

封装实现

暴露接口

声明依赖

例子：case：计算器

anti-pattern 反模块

math.js function add(a, b) { return a + b; } function sub(a, b) { return a - b; } calculator.js var action = "add"; function compute(a, b) { switch (action) { case "add": return add(a, b) case "sub": return sub(a, b) } }

 

math.js：无封装性；接口结构不明显

calculator.js：没有依赖声明；使用全局变量action

Object Literal 字面量

math.js var math = { add: function add(a, b) { return a + b; }, sub: function sub(a, b) { return a - b; } } calculator.js var calculator = { action: 'add', compute: function compute(a, b) { switch (action) { case "add": return math.add(a, b) case "sub": return math.sub(a, b) } } }

 

math.js：结构性好；但是没有访问控制

calculator.js：还是没有声明依赖，无法标明action为私有的，在外部也可以使用

IIFE (Immediately-invoked Function Expression) 自执行函数表达式--帮助创建局部作用域

calculator-1.js var calculator = (function() { var action = "add" return { compute: function (a, b) { switch (action) { case "add": return math.add(a, b) case "sub": return math.sub(a, b) } } } })()

 

calculator.js：有了访问控制，但是还是没有依赖声明

 

calculator-2.js var calculator = (function(m) { var action = "add" function compute (a, b) { switch (action) { case "add": return m.add(a, b) case "sub": return m.sub(a, b) } } } return { compute: compute } })(math)

 

 

 

calculator-2.js：显示了依赖声明，但是仍然污染了全局变量，而且需要手动进行依赖管理

Namespace 命名空间

math.js namespace("math", [], function() { function add(a, b) { return a + b } function sub(a, b) { return a - b } return { add: add, sub: sub } }) calculator.js namespace("calculator", ["math"], function(m) { var action = "add" function compute(a, b) { return m[action](a, b) } return { compute: compute } })

 

进行了依赖声明，["math"]做了依赖注入

 

 

模块系统：

 

课堂交流区

市面上这么多种模块系统， 它们之间可以相互转换吗

AMD、COMMONJS、CMD、UMD、ES6 Module、IIFE... 这么多的模块写法， 一旦你选择了一种模块写法，那它在另一个系统中就可能无法运行了。 值得庆幸的是，现在越来越多的工具可以帮助我们将js从一种模块写法转换为另一种写法， 你能帮助同学们列举出一个或多个转换工具吗？

 

框架

 

 

技术选型的单元测验

返回

本次得分为： 7.50/9.00, 本次测试的提交时间为： 2017-09-12, 如果你认为本次测试成绩不理想，你可以选择 再做一次。 1 多选(3分)

以下哪几种方式可以实现依赖分析, 而无需手工管理

得分/总分 A.

ES6/module

1.50/3.00 B.

字面量对象

C.

命名空间

D.

Commonjs/module

2 判断(2分)

利用AMD规范的模块系统可以实现模块的异步载入

得分/总分 A. √ 2.00/2.00 B. × 3 判断(2分)

字符串模板可以同时用于服务器端和浏览器端

得分/总分 A. √ 2.00/2.00 B. × 4 判断(2分)

ES5以及将来的ES6,ES7都不会有语言级的模块化支持，所以我们才需要模块系统

得分/总分 A. √ B. × 2.00/2.00

第5章--开发实践

系统设计

系统实现

测试发布

 

 

《产品前端架构》课堂交流区问题汇总

http://www.aichengxu.com/product/24596509.htm

 

转载于:https://www.cnblogs.com/FudgeBear/p/7507819.html