资讯专栏INFORMATION COLUMN

学习单页面应用1-4章总结

jayce / 3393人阅读

摘要:单页面应用从前端到后端这本书是一本教读者怎样将模块化,也就是前端同学们常说的模块化思想,变量避免全局污染以及将功能分块管理。

《单页面web应用 JavaScript从前端到后端》这本书是一本教读者怎样将js模块化,也就是前端同学们常说的模块化思想,变量避免全局污染以及将功能分块管理。

那么应该怎么开始呢?

确定要做页面的聊天滑块

进行页面结构的简单设计,确定将聊天滑块放在被关注率和点击率最高的右下角

确定滑块需要实现的功能

当打开页面的时候滑块处于最小化

当点击滑块时,滑块实现最小化和最大化之间的切换

接下来的事情:单页应用的初步试探

js文件结构的确定:

确定js的入口文件spa.js

确定spa.shell.js核心的js文件,可以调用应用中的任何子模块,比如接下来所说的spa.chat.js,但是的子模块之间是不可以随意调用的。

那接下来就是实现具体功能的模块spa.chat.js

来一张比较清晰的线框图:

图上清楚的显示shell是核心的js,chat是真正分离出来的功能块,在chat中是处理聊天滑块的文件。

这样其实架子就算是搭起来了,我们就可以开始码代码啦啦啦啦~~~~

滑块代码直接放到chat中就可以了,前边已经提到,这种模块思想中有避免变量污染全局,所以每一个功能模块都有自己的命名空间。也就是,spa,spa.shell,spa.chat。

具体到代码

总体来说,每个文件中的代码都有配置,初始化的功能,作者已经给出,配置使用configMap,初始化使用initModule,当开始书写代码的时候,首先要确定在此命名空间下中需要的变量(当然也包括函数变量名称),要一次提前声明好。这样在每个文件中的代码也会清晰的展现。
比如:

变量区域

公共方法区域

公共的工具区域

事件方法区域

初始化区域

这样每个js文件都是这样的布局,当文件越来越复杂的时候,前端的代码会越来越好写,而且可读性很高。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/86144.html

相关文章

  • 学习页面应用1-4总结

    摘要:单页面应用从前端到后端这本书是一本教读者怎样将模块化,也就是前端同学们常说的模块化思想,变量避免全局污染以及将功能分块管理。 《单页面web应用 JavaScript从前端到后端》这本书是一本教读者怎样将js模块化,也就是前端同学们常说的模块化思想,变量避免全局污染以及将功能分块管理。 那么应该怎么开始呢? 确定要做页面的聊天滑块 进行页面结构的简单设计,确定将聊天滑块放在被关注率和...

    xiangchaobin 评论0 收藏0
  • 学习页面应用1-4总结

    摘要:单页面应用从前端到后端这本书是一本教读者怎样将模块化,也就是前端同学们常说的模块化思想,变量避免全局污染以及将功能分块管理。 《单页面web应用 JavaScript从前端到后端》这本书是一本教读者怎样将js模块化,也就是前端同学们常说的模块化思想,变量避免全局污染以及将功能分块管理。 那么应该怎么开始呢? 确定要做页面的聊天滑块 进行页面结构的简单设计,确定将聊天滑块放在被关注率和...

    ddongjian0000 评论0 收藏0
  • [译] 如何恰当地学习 JavaScript

    摘要:原文链接恰当地学习适合第一次编程和非的程序员持续时间到周前提无需编程经验继续下面的课程。如果你没有足够的时间在周内完成全部的章节,学习时间尽力不要超过周。你还不是一个绝地武士,必须持续使用你最新学到的知识和技能,尽可能地经常持续学习和提高。 原文链接:How to Learn JavaScript Properly 恰当地学习 JavaScript (适合第一次编程和非 JavaSc...

    Jason 评论0 收藏0
  • 架构师之路

    摘要:因为用户不用在第一次进入应用时下载所有代码,用户能更快的看到页面并与之交互。译高阶函数利用和来编写更易维护的代码高阶函数可以帮助你增强你的,让你的代码更具有声明性。知道什么时候和怎样使用高阶函数是至关重要的。 Vue 折腾记 - (10) 给axios做个挺靠谱的封装(报错,鉴权,跳转,拦截,提示) 稍微改改都能直接拿来用~~~哟吼吼,哟吼吼..... 如何无痛降低 if else 面...

    NikoManiac 评论0 收藏0
  • 多线程基础必要知识点!看了学习多线程事半功倍

    摘要:是需要我们去处理很多事情,为了防止多线程给我们带来的安全和性能的问题下面就来简单总结一下我们需要哪些知识点来解决多线程遇到的问题。 前言 不小心就鸽了几天没有更新了,这个星期回家咯。在学校的日子要努力一点才行! 只有光头才能变强 回顾前面: 多线程三分钟就可以入个门了! Thread源码剖析 本文章的知识主要参考《Java并发编程实战》这本书的前4章,这本书的前4章都是讲解并发的基...

    YPHP 评论0 收藏0

发表评论

0条评论

jayce

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<