摘要：中间的一层，就是控制层，它负责根据用户从视图层输入的指令，选取数据层中的数据，然后对其进行相应的操作，产生最终结果。这三层之间紧密联系，又互相独立，每层内部的变化不影响其他层。用做简历学习了思想后，用思想做了简历的留言板。
模块化
什么是模块化？就是把一个东西分成几个块（模块），块与块之间互相独立。
在台式机时代，很多人都自己主装过电脑，选购自己喜欢的显示器，鼠标，键盘，主机，配备性能强劲的cpu、显卡、内存等主成最强配置，这些单个物体都是模块，互相独立，可以根据自己的爱好选择。
模块化主要解决合作问题
自己与自己合作
自己与以前的自己合作
自己与别人合作
MVCMVC 是一种代码组织形式，他不是任何一种框架，也不是任何一种技术，它就是一种组织代码的思想，我们要做到事情就是把 M 和 V 传给 C，C 负责初始化 M，然后对 V 进行操作。
画成图就是这样：
MVC具体是什么呢？阮一峰老师给了我们很好的解答：
1）最上面的一层，是直接面向最终用户的"视图层"（View）。它是提供给用户的操作界面，是程序的外壳。2）最底下的一层，是核心的"数据层"（Model），也就是程序需要操作的数据或信息。
3）中间的一层，就是"控制层"（Controller），它负责根据用户从"视图层"输入的指令，选取"数据层"中的数据，然后对其进行相应的操作，产生最终结果。
这三层之间紧密联系，又互相独立，每层内部的变化不影响其他层。
用 MVC 做简历学习了 MVC 思想后，用 MVC 思想做了简历的留言板。
我没有自己买服务器，用了线上免费的服务器——leancloud，具体的使用方法可以看它的使用文档，这里就不在赘述了。
先上图，静态页面是仿造网易云音乐做的，做完下来发现有点丑。
我做这个大概要实现的功能是：
用户可以留言，必须要输入用户名和留言内容（留言区左边方框本来是头像，我把它做成输用户名的地方）
点击发表后，留言会立马出现在留言墙上
评论条数实时更新
显示日期
点赞功能
回复功能
本想全部用原生 JS 做的，无奈自己水平太次，有些地方使用的 jQuery。
目前做好的功能是1、2、3，剩余三个做了一部分，其中点赞功能在我实践下来，貌似实现不了，数据传送到后台，不能累计，所以只做了静态的更新，一刷新就没了。
显示日期功能，自己对原生 JS 掌握的不好，没有做成我们常用的日期格式。
回复功能，今天来不及做了，因为还需要做两套样式，一套是回复时的输入框，以及上墙后的样式（这点最后再来做吧）。
今天花时间比较多的地方是动态创建 DOM 元素，还没有效果，用原生 JS 真的好难实现，我刚开始全部用createElement创建标签，然后在一个个appendChild到页面中，长长的写了一坨，还不能复用，突然就想到自己能不能实现jQuery的html方法，果然很傻很天真，jQuery源代码看了半天没看懂。算了，果断放弃，还是老老实实使用它吧。
MVC 的 V，页面可视区域document.querySelector(".messages")，所有操作都是在它内部。
MVD 的 M，操作服务器，获取和保存数据，只负责操作服务器，至于返回数据的操作统一由 C 完成
初始化 AV 对象 initAV
请求数据 fetch
保存数据 save
2 和 3 都是返回 Promise 对象，可以直接在后面进行then操作。
MVC 的 C，负责监听 V、调用 M；M 和 V 都在初始化的时候传递给 C，C 内部不直接操作 M 和 V。
常用的变量
init：初始化变量和各操作
绑定事件：目前只做了留言功能
进入页面后，加载留言
留言后发送服务器，并上墙
用 MVC 思想的，每个模块里面也都是各个独立的，每个方法只做该部分该做的事情，这次我做的不是很好，还是有很多混在了一起。
C 部分除了上面讲的的 DOM 操作外，还有两个比较费时的地方。
第一个是，我需要的数据是用户名，留言内容和时间，这三个数据放在了两个属性里面，如果我要自己实现动态创建 DOM 的话，这数据很难拿到，需要反复的遍历后台返回的对象，这就会造成新能很差。后来想到了一种方法——把他们以对象的形式分别push到数组，出现了一个问题，数组的下标全是偶数，并不是0,1,2,3,4 这样排列的，这两个卡在了一起，后来用了 jQuery 之后配合 ES6 语法，很轻松就搞定了（偷懒了）。
第二个是留言上墙时，留言总数实时更新，数据拿到之后，怎么弄都不能加1，老当成字符串解析，但用 typeof 检测返回的又是 number ，搞的头都晕，试到最后才想起parseInt，我艹，好了，我的天。typeof 果然是个大坑。
总之今天收货挺大的，发现自己有好多问题，主要两点：代码思路不清晰，出错了会卡很久；做之前没考虑全，做到最后才发现最关键的数据拿不到，白白浪费时间。
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/108332.html
摘要：前提好几周没更新博客了，对不断支持我博客的童鞋们说声抱歉了。熟悉我的人都知道我写博客的时间比较早，而且坚持的时间也比较久，一直到现在也是一直保持着更新状态。 showImg(https://segmentfault.com/img/remote/1460000014076586?w=1920&h=1080); 前提 好几周没更新博客了，对不断支持我博客的童鞋们说声：抱歉了！。自己这段时...
摘要：需求根据客户端环境，界面显示不同的国旗图案。选择的技术方案可利用提供的国际化和主题定制来解决。注意此时返回的中没有国际化及主题相关的信息。修改请求参数的值为荷兰，即后再发起请求，结果如下与预期一致，测试通过。 概述 以上分析了Spring MVC的LocaleResolver和ThemeResolver两个策略解析器，在实际项目中很少使用，尤其是ThemeResolver，花精力去分析...
摘要：模式的核心是为了将模型从视图控制器中分离出来，从而使得模型独立于它们，因此模型不包含对视图和控制的引用。 写在最前面的那些话 相信对于大多数小白来说,关于MVP、MVC设计模式肯定是听过也看到过很多次了,也许也有过一些简单了解,但关于TA的具体概念,如何使用以及具体应用等都毫无所知,所以本着许多小伙伴一看到mvp、mvc就一脸懵逼的表情(当然也包括本人了⊙▽⊙)#),最近上手一个基于m...
摘要：前后经过九个月，我翻译的官方版本中文文档可以发布第一个较为完整的版本了。这点原本是最重要的，但让位于符合中文习惯，是因为如果译本有机翻痕迹，给人的品质感和可信度就降低了更准确和更优雅的翻译风格。 showImg(/img/remote/1460000006773992); 前后经过九个月，我翻译的Spring MVC官方4.2.4版本中文文档可以发布第一个较为完整的版本了。译文上尽量做...
摘要：内容包括翻译环境搭建项目管理与自动化构建三部分。博客首页声明官方文档翻译稿发布托管在七牛上的翻译文档仓库环境搭建翻译与写作一样，首要之事均为专注于翻译写作本身，而不考虑样式等方面。安装完成后，运行即可在启动一个本地的。 感兴趣的同学可以关注这个翻译项目 、 我的博客原文 和 我的Github showImg(/img/remote/1460000006776466); 前段时间翻译的S...
阅读 3533·2021-10-14 09:43
阅读 3170·2021-08-25 09:38
阅读 423·2019-08-30 15:55
阅读 1200·2019-08-30 13:05
阅读 2122·2019-08-29 16:05
阅读 383·2019-08-29 12:58
阅读 2686·2019-08-29 12:34
阅读 3129·2019-08-26 12:15
