第28/90步《前端篇》第7章 重构背景音乐、小球和挡板 第19课

简介: 今天学习《前端篇》第7章 重构背景音乐、小球和挡板 第19课 创建背景音乐模块,这节课我们正式开始模式化重构,将背景音乐、小球、挡板、分数、背景等游戏元素全部模块化,首先从背景音乐对象开始。

image.png

今天学习《前端篇》第7章 重构背景音乐、小球和挡板 第19课 创建背景音乐模块,这节课我们正式开始模式化重构,将背景音乐、小球、挡板、分数、背景等游戏元素全部模块化,首先从背景音乐对象开始。


学习目标


  • 开始创建背景音乐模块
  • 拓展:重新认识class和函数调用中的this
  • 拓展:认清JS的内存管理
  • 拓展:了解代码的优化评判标准
  • 改进复用性和易用性:将数据参数化,将参数默认化
  • 改进封装性:将内部成员私有化
  • 优化图片渲染:由多次加载改为加载一次
  • 改进封装性:添加getter
  • 对易用性的改进:直接导出单例

主要知识点/技能点



实践疑难点



小结


这节课主要创建了背景音乐模块,并针对该模块根据面向对象的代码评判标准做了多方面的重构优化,在实践过程中我们还学习了JS的内存管理策略、值类型与引用类型的差异等内容。


目录
相关文章
|
7月前
|
前端开发 JavaScript 安全
|
前端开发
前端学习笔记202305学习笔记第二十三天-项目重构构建
前端学习笔记202305学习笔记第二十三天-项目重构构建
117 0
|
Dart 前端开发 测试技术
【Flutter前端技术开发专栏】Flutter开发中的代码质量与重构实践
【4月更文挑战第30天】随着Flutter在跨平台开发的普及,保证代码质量成为开发者关注的重点。优质代码能确保应用性能与稳定性,提高开发效率。关键策略包括遵循最佳实践,编写可读性强的代码,实施代码审查和自动化测试。重构实践在项目扩展时尤为重要,适时重构能优化结构,降低维护成本。开发者应重视代码质量和重构,以促进项目成功。
220 0
【Flutter前端技术开发专栏】Flutter开发中的代码质量与重构实践
|
缓存 前端开发 JavaScript
前端项目重构的一些思考和复盘
前端项目重构的一些思考和复盘
322 1
|
前端开发
前端学习笔记202305学习笔记第二十三天-登录页面重构和总结1
前端学习笔记202305学习笔记第二十三天-登录页面重构和总结1
72 0
前端学习笔记202305学习笔记第二十三天-登录页面重构和总结1
|
缓存 监控 前端开发
带你入门前端工程(十):重构
带你入门前端工程(十):重构
124 0
|
前端开发
前端学习笔记202305学习笔记第二十三天-路由ts重构
前端学习笔记202305学习笔记第二十三天-路由ts重构2
77 0
|
存储 人工智能 前端开发
前端大模型应用笔记(三):Vue3+Antdv+transformers+本地模型实现浏览器端侧增强搜索
本文介绍了一个纯前端实现的增强列表搜索应用,通过使用Transformer模型,实现了更智能的搜索功能,如使用“番茄”可以搜索到“西红柿”。项目基于Vue3和Ant Design Vue,使用了Xenova的bge-base-zh-v1.5模型。文章详细介绍了从环境搭建、数据准备到具体实现的全过程,并展示了实际效果和待改进点。
1024 14
|
JavaScript 前端开发 程序员
前端学习笔记——node.js
前端学习笔记——node.js
327 0
|
人工智能 自然语言处理 运维
前端大模型应用笔记(一):两个指令反过来说大模型就理解不了啦?或许该让第三者插足啦 -通过引入中间LLM预处理用户输入以提高多任务处理能力
本文探讨了在多任务处理场景下,自然语言指令解析的困境及解决方案。通过增加一个LLM解析层,将复杂的指令拆解为多个明确的步骤,明确操作类型与对象识别,处理任务依赖关系,并将自然语言转化为具体的工具命令,从而提高指令解析的准确性和执行效率。
456 6

热门文章

最新文章

  • 1
    前端如何存储数据:Cookie、LocalStorage 与 SessionStorage 全面解析
  • 2
    前端工程化演进之路:从手工作坊到AI驱动的智能化开发
  • 3
    Vue 3 + TypeScript 现代前端开发最佳实践(2025版指南)
  • 4
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(五):背景属性;float浮动和position定位;详细分析相对、绝对、固定三种定位方式;使用浮动并清除浮动副作用
  • 5
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(六):全方面分析css的Flex布局,从纵、横两个坐标开始进行居中、两端等元素分布模式;刨析元素间隔、排序模式等
  • 6
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(一):CSS发展史;CSS样式表的引入;CSS选择器使用,附带案例介绍
  • 7
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(八):学习transition过渡属性;本文学习property模拟、duration过渡时间指定、delay时间延迟 等多个参数
  • 8
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(九):强势分析Animation动画各类参数;从播放时间、播放方式、播放次数、播放方向、播放状态等多个方面,完全了解CSS3 Animation
  • 9
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(四):元素盒子模型;详细分析边框属性、盒子外边距
  • 10
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(二):CSS伪类:UI伪类、结构化伪类;通过伪类获得子元素的第n个元素;创建一个伪元素展示在页面中;获得最后一个元素;处理聚焦元素的样式