7gugu’s blog

日本分站

设计模式 面向对象设计原则

  • 课程目标
    • 面向对象设计原则
  • 原则概述
    • 可维护性
      • 指的是软件可以很方便的理解、改正、适应和拓展的难易程度
      • 就是方不方便修改了的意思
    • 可复用性
      • 指的是软件能被重复使用的难易程度
    • 指导性原则
    • 用于评价一个设计模式的使用效果的重要指标之一
    • 为支持可维护性复用诞生
  • 单一职责原则
    • 一个类制作一件事
    • 作用
      • 用于控制一个类的粒度
      • 保证一个类里面不用实现所有的功能,仅仅需要实现单一职责即可
    • 定义
      • 一个对象应该只包含单一的职责,并且该职责被完整地封装在一个类中
    • 就一个类而言,应该仅有一个引起变化的原因
  • 开闭原则
    • 不修改源代码,只添加代码
    • 定义
      • 软件实体只能增加功能,尽量不修改功能
      • 尽可能只是拓展代码来增加新功能/修改原有功能
    • 关键
      • 抽象化
    • 具有稳定的抽象层+灵活的具体层
    • 修改配置文件,增加类,这个些操作都符合开闭原则
  • 里氏代换原则
    • 父类对象可被子类对象代替,且程序将不会产生任何错误和异常(因为子类把父类的一些方法重载了)
    • 在程序中尽可能使用基类类型来对对象进行定义
  • 依赖倒转原则
    • 编程使用配置文件,仅仅是接受对象操作对象,在外部进行创建对象注入
  • 接口隔离原则(网络上的那种API接口)
    • 一个接口尽可能做少的事情
    • 把接口都拆开来
  • 合成复用原则
    • is-a继承复用  has-a组合/聚合复用
    • 就是类似于把mysql的obj反射出来,然后再操作
  • 迪米特原则
    • 减少对象之间的交互
    • 两个对象不应该发生任何直接的相互作用
    • 通过"第三者"转发这个调用
    • 引入一个合理的"第三者"来降低现有对象之间的耦合度

设计模式: 统一建模语言

第一章

  • 课程目标
    • 统一建模语言
  • UML
    • 统一建模语言
    • 概念
      • 通用的可视化建模语言
      • 通过一些标准的图形符号和文字对系统进行建模
    • 作用
      • 对于软件进行描述、可视化处理、构建软件系统的文档
    • 视图(View)
      • 用户视图
        • 以用户的观点来标识系统的目标,它是所有视图的核心
        • 描述系统的需求
      • 结构视图
        • 表示系统的静态行为
        • 描述系统的静态元素,如包、类与对象,以及它们之间的关系
      • 行为视图
        • 表示系统的动态行为
        • 描述系统的组成元素如对象在系统运行时的交互关系
      • 实现视图
        • 表示系统中逻辑元素的分布
        • 描述系统中的文件以及它们之间的关系
      • 环境视图
        • 表示系统中物理元素的分布
        • 描述系统中的硬件设备以及它们之间的关系
      • 视图关系图

  • 图(Diagram)
    • 用例图
    • 类图
    • ...
  • 模型元素(Model)
    • 模型元素
      • 就是图上面的符号
      • 用于描述事物以及事物与事物之间的关系
    • 每一个模型元素都要一个阈值相对应的图形元素
    • 同一个模型元素可以在不同的UML图中使用
    • 定义
      • 封装了数据和行为
      • 是具有相同属性、操作、关系的对象集合的总称
      • 一个类可以有多个职责(功能),但设计的好的类通常只有单一职责(功能)
    • 类的属性
      • 类的数据职责
    • 类的操作(类实现的方法)
      • 类的行为职责
  • 类图
    • 用来描述不同的类以及它们之间的关系
  • UML类图
    • 类名

  • 类的属性

  • 类的操作(其实就是类实现的方法)

  • 类之间的关系
    • 关联关系
      • 表示一类对象与另一类对象之间的关系
      • 实线连接
      • 通常将一个类的对象作为另外一个类的成员变量
      • 单向关联

  • 双向关联(就是两个类互相作为对方的成员属性)

  • 自关联(就是自己的成员属性存储了一个自身的对象)

  • 多重性关联(就是有2个+的成员变量存储/被存储了)
    • 多重表示,通常在直线上使用一个数字/数字范围来表示

  • 图例

  • 聚合关系
    • 表示整体与部分的关系(容器与成员的关系)
    • 成员对象是整体对象的一部分,但是成员对象可以脱离整体对象独立存在
    • 使用带空心菱形的直线表示
    • 图例

  • 组合关系
    • 聚合关系相同的表示
    • 成员是整体的一部分,但是成员对象跟整体对象的生命周期一样,整体对象销毁了,成员对象也会被销毁
    • 使用带实心的菱形直线表示
    • 因为是在整体(Head)对象中new的对象,销毁了head,就会连带把成员对象都销毁掉

  • 依赖关系
    • 表示一个事物使用另外一个事物
    • 体现在某个类的方法使用另一个累的对象作为参数
    • 使用带箭头的虚线
    • 依赖的一方指向被依赖的一方

  • 三种实现方法

  • 泛化关系(继承关系)
    • 用于描述父类与子类的关系
    • 用带空心三角形的直线表示
    • 图例

  • 接口与实现关系
    • 接口之间也存在继承关系和依赖关系
    • 接口与雷志坚存在一种实现的方法
    • 使用带空心三角形的虚线表示
    • 图例

  • 拓展机制
    • 注释
      • 可以给类图(UML)增加注释

开发心得Vol.1

前言

最近开始学习ES6的语法,然后突然想到去年挖下来的小程序的坑还没有填完,就开始捣鼓起来了。接下来会分享一些我在这次开发过程中遇到的坑点和经验,由于小程序是微信发起来的,所以有很多问题都可以尝试在小程序的开发社区里面搜一下。

UI框架推荐

这次最蠢的一件事就是手莽课表,殊不知已经有前人开发出了插件。自己写CSS实在是痛苦。有一部分的UI也用了微信的WeUI,但其实还有更多选择:

  1. WeUI官方样式库
  2. iView
  3. ColorUI
  4. Vant

通过这几个组件库可以快速构建小程序,不用花过多的时间在UI上,很适用于我们这些后端开发者。

SSL配置

如果你的小程序需要向你的服务器发起数据请求的话,就要留意这一点。小程序文档中要求你的后端接口的网址必须满足以下两点:

  1. HTTPS
  2. 已经备案

无论你的主机在哪都要给你的域名备案,不然真机模拟的时候就永远都无法请求,会报图1.1的问题。

Provisional headers are shown

如果你的证书已经备案了,还是报这种错误的话,那就是你的接口缺少了证书。一般tx云或者阿里云的免费证书就够用了,直接申请就可以。

如果还是报错,那就是缺失了中间证书。具体体现就是你的浏览器可以直接访问,并且确实走的是HTTPS,但就是无法请求,你可以通过这个网址:https://www.myssl.cn/tools/check-server-cert.html检测是否缺失中间证书。一般是需要把root和domain name的证书打包在一起才行,就是用.pem和.key后缀的文件作为证书文件绑定到你的Http服务器上。

JS平台差异

这个点主要是出现在Date对象上面

//Android平台上这么写将会正常返回对象
let obj = new Date("2020-02-27");
obj.getDay();
//IOS平台只支持用"/"来分割时间
let obj = new Date("2020/02/27")
//如果你使用"-"来创建对象的话,ios将会返回null

这个是我目前认为小程序最为诟病的一个问题。就是多平台JS不通用。小程序的本质上还是VUE,样式基本上没啥问题,但js出现了bug就真的特别难复现,这个bug甚至在控制台中是无法找到的,实在是恶心,希望微信会尽快修好。

结尾

其实小程序是一个很好的分发平台,但是太多毛刺会减弱大家的开发积极性,希望以后会越做越好。也希望能帮到你,Peace

GCU课表+

简介

一款专属于华广人的校园生活类小程序(因为也写了手动添加课程的功能,所以理论上别的学校的学生也能用:))

特性

  1. 支持教务系统导入课表
  2. 支持自由编辑课表
  3. 离线存储,0s加载
  4. 自定义壁纸

ToDo

  1. 生成无课表
  2. 查询成绩

小程序码

截图

开发心得

JavaScript OOP笔记[ES3]

简介

最近开始要学习ES6了,翻出JS看了看,发现OOP部分还没有掌握,所以就赶紧进行了补课。下面是这次学习的一些,个人认为重要的知识点。

对象

每次使用JavaScript的构造器时,都会创建一个对象。一个初始化的对象中将会含有一个属性集,称之为prototype(对象属性),还有一个constructor(构造器)。而属性集里面中则会默认存在一个属性_proto_(原型)。这个属性存储的是父类的prototype(可以理解为指向父类的一个指针)。

对象属性

访问对象属性

对象.prototype.属性名

创建对象属性

对象.prototype.属性名 = 值

继承

JavaScript中实现继承主要是通过修改对象的_proto_(原型)指向到父原型来实现的继承。一旦理解了就会很简单,但是这个设计真的不好,而且原型这个称谓真的太容易混淆了。

注意!

//错误的继承
student.prototype = person.prototype;

解释:因为如果是这么赋值的话,在后续的操作中,比如给student增加属性或者方法时,收student的本质还是person,这样子修改的话,本质上还是修改的person的对象属性。

//正确的继承
student.prototype = Object.create(person.prototype)
//此时就可以正确把student的_proto_正确的指向person.prototype了

(JavaScript在ES6中貌似已经引入了extend应该能改善当前这个反人类的设计了)

原型

原型就是对象上一个存储父类的属性,称之为_proto_。该属性将会用于指向父类的对象属性,如下图1.1中bosn是实例化Student的对象,则bosn的_proto_(原型)就会指向Student.prototype(对象属性);Student的父类是Person,则Student的_proto_(原型)就会指向person.prototype;由于Object是顶层对象,所以它的原型就是NULL。

图1.1

原型链

图1.1中的bosn的原型指向Student,Student的原型又会指向Person,Person的原型又会指向Object,则称这条联系为原型链。

InstanceOf

该方法用于判断方法右边的函数是否存在于左边对象的原型链中,返回一个Bool值。其原理还是通过遍历prototype来看看左边的原型链上面是否存在右边函数的prototype。

用途:判断对象是否存在该方法(函数)

尾言

说实话,平时对于JavaScript的应用还停留在普通的事件应用,函数闭包这种层面,第一次了解了关于JS的面对象过程,也是受益匪浅,希望可以帮助到后续的ES6的学习,如果你觉着这篇文章好的话,不妨点一个赞吧,如果我理解有错误,也欢迎在下方评论区中学习交流owo。

Bad Apple

前序

其实这个BAS动画我一直很想写的了,只是一直咕咕咕,还有身边的琐事,一直没抽出空来写一下弹幕动画。这次终于抽出空来写了一个(AV88558525),欢迎来看看。这篇博文主要是会分享一下这个BAS弹幕动画是怎么做出来的,以及一些BAS的个人看法。

处理流程

  1. 使用ffmpeg把BadApple.mp4分割成图片
  2. 使用PHP*将图片转换成字符画
  3. 将字符画拼接成BAS字符串
  4. 计算每一组BAS的起始时间
  5. 在视频上发布
  6. 微调**

*:语言没啥所谓,重点一定是能处理图片,还有就是顺手,python虽然有很多库,语法很优雅,但我是一个phper,所以还是倾向用php整活(PHP天下第一)

**:音乐视频可以找鼓点来定位,如果你放的视频的节奏型不是特别强无对话的话,你就随缘调吧,反正最后还是会有偏差的。

代码

我在最下面也会放一个已经打包好的给大家试试看

代码解析

视频转换

视频转换,我使用的是这个dalao的代码。地址:https://blog.csdn.net/somehow1002/article/details/77600186

切割视频

切割视频的码率一定要设置成30帧一秒,不然会卡到爆炸。

txt转BAS

其实BAS转换非常简单,你可以看到我的代码也就是跑了两个循环就拼接好了。每个BAS弹幕的开口是def c{属性},然后是set c{content=""},再然后的就都是then set c{xxxxx}。

这个c是可以换的仅仅是一个函数名而已,你换成啥都行。这里主要是要控制多少个bas组成一组。这次的经验是:

  • 0.033s为一帧
  • 三个为一秒
  • 201/402为一组

目前测试单次弹幕为408KB,就是已知的B站容许POST的数据量。再大的话服务器那边会提示服务器错误(就是不允许你发这么大个的弹幕了),但如果本地测试的话,播放器单次怼1206个16x32的字符画也是OK的。

时间计算

这一步主要是要标定弹幕的开始时间,按照402个为一组的话,一段的时间是13266ms,那么第一段的时间就是0ms开始,第二段就是0+13266+1开始,偏移1ms让弹幕不要叠在一起。

还有就是要对鼓点,不然整个视频的节奏就会很有问题。除非你的视频没有啥节奏,不然就很有必要对多几次,这里有一些想吐槽的就放到最后再写。

成果

代码包

链接: https://pan.baidu.com/s/1F-lN_FgsF0LDwyxeIQz6qw 提取码: qmdz

我也想放在FireFox Send啥的,但奈何度盘太香了,还是放在了度盘,各位克服一下整下来吧,实在不行邮箱我,我在邮箱发给你。

使用指南

直接php generator.php运行即可

吐槽

语法缺失

其实最最大的缺点就是这个BAS语法没有加入一些for,if之类的语法定义,这个script甚至连Boolean都没有定义,可以玩的东西实在有限。最多只能写一些动画出来玩玩。

标准缺失

这个标准指的是弹幕数据的一些标准,虽然平常发弹幕实际能触顶的机会十分的少,但是对于BAS制作者来说,这些标准的指定可以大大减少我们的开发时间。之所以这么耗费功夫其中的一个原因就是总是要测试标准的上限在哪,客服一问三不知,也没法实质的解决,希望B站以后可以写出来。(已反馈到B站)

批量弹幕发送困难

对于技术宅来说可以用自动化测试套件/窗口捕获/模拟POST来实现批量提交弹幕,但这些基础脚本的编写也是要花费时间的,导致整个制作周期会拉长实在是非常讨厌,而这也就是我想说的另外一个耗费功夫的原因,实在是太麻烦了。就算是目前有多Tab,来发送还是繁复的不得了。其实解决方案应该是创建一个API中心,开发者/UP主可以针对单一视频通过API来提交弹幕。而且可以限制API单次使用时间,确保站点安全。

总结

上述的几个建议如果都能改进或者加入,相信BAS还有更多的空间发展,当初的代码弹幕的辉煌也会回来的。最近的互动视频的动作其实就不错,如果可以把BAS也加入其中,想必会给互动视频加入更多有意思的元素,B站黄油,B站FPS指日可待。

感谢你看到这里,希望你喜欢OWO