设计模式: 关于编程范式的声明式和命令式编程及应用框架的开发和设计原则

编程范式

  • 命令式编程
  • 声明式编程

上述两种范式是相对来说的

命令式编程

  • 详细描述做事过程的方式就可以叫做 命令式
  • 例子: 张三妈妈让张三买食盐
    • 拿钱,开门,下楼,到商店,付款,带着食盐回家
  • 例子:在指定div中展示hello world 文本
    var divEle = document.querySelector('#app')
    divEle.innerHTML = 'hello world'
    
  • 上述div的例子代码虽然只有两部,但是它清晰描述了,完成这件事情,所需要经理的过程
  • 如果我们所做的事情变复杂了,那整个过程也会变得更加复杂
  • 总之:命令式是:关注过程的一种编程范式类似面向过程编程思想,但不一定是面向过程,它描述了完成一个功能的详细逻辑与步骤

声明式编程

  • 声明式:不关注过程,只关注结果的 范式,它并不关心完成一个功能的详细逻辑与步骤,(这并不意味着声明式不需要过程,只是把过程隐藏了)
  • 张三的妈妈说的话,就是声明式编程
  • 例如:模板语法
    <div> {{ msg }} </div>
    

命令式 VS 声明式

  • 哪种好?由两个方向来对比
    • 性能
    • 可维护性

1 )性能

  • 例子
    • div.innerText = 'hello world' 这行代码耗时为1
    • <div>{{ msg }}</div> 这行代码耗时为 1 + n 这里的n是解析处理msg到页面渲染的整个过程
  • 上述例子,我们用耗时来代表性能,耗时越少,性能越强
  • 我们知道:声明式耗时 >= 命令式耗时,即:命令式性能 >= 声明式性能

2 ) 可维护性

  • 可维护性是指,对代码可以方便的 阅读,修改,删除,增加
  • 说白了,代码逻辑越简单,可维护性越强
  • 基于vue的声明式代码可维护性 > 原生js命令式代码的可维护性

企业应用框架的开发和设计原则

  • 企业应用开发和设计如何权衡命令式和声明式两种维度的选择
  • 对不同的企业类型,不同的项目类型 (前台,中台,后台)来说,对应的企业应用设计也存在差异
  • 最关注的两个指标
    • 项目成本: 主要看项目的开发周期,开发周期越长,所付出的人员成本越高,从而导致项目成本越来越高
    • 开发体验: 决定开发者开发体验的核心要素,主要是在开发时和阅读时的难度,这个叫做:心智负担, 声明式开发体验更好,心智负担更低
  • 框架的设计是一个不断取舍的过程,就像是算法一样,没有最优,而是最均衡合适的
    • 1)命令式性能 > 声明式性能
    • 2)命令式可维护性 < 声明式可维护性
    • 3)声明式的框架本质上是由命令式的代码来去实现的
    • 4)企业项目开发,多使用声明式

框架开发和设计原则

  • 在使用vue时是基于声明式的,但是vue内部是通过命令式来实现的
  • vue封装了命令式的逻辑,对外暴露出了声明式的接口
    • 原因在于命令式的可维护性 < 声明式的可维护性
    • vue需要做的是,封装命令式逻辑,同时尽可能减少性能的损耗,在性能和可维护性之间,找到一个平衡点
    • vue的设计原则是:在保证可维护性的基础上,尽可能减少性能损耗

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/214526.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

验证二叉搜索树[中等]

优质博文&#xff1a;IT-BLOG-CN 一、题目 给你一个二叉树的根节点root&#xff0c;判断其是否是一个有效的二叉搜索树。有效 二叉搜索树定义如下&#xff1a; 【1】节点的左子树只包含 小于 当前节点的数。 【2】节点的右子树只包含 大于 当前节点的数。 【3】所有左子树和右…

Leetcode 40 组合总和 II

题意理解&#xff1a; 每个数字在每个组合中只能使用 一次 数字可以重复——>难点&#xff08;如何去重&#xff09; 每个组合和target 求组合&#xff0c;对合限制&#xff0c;考虑回溯的方法。——将其抽象为树结构。 树的宽度——分支大小 树的深度——最…

Spring IoC和DI

目录 一. Spring是什么 IoC DI 二. IoC&DI的使用 IoC 1.Controller&#xff08;控制器存储&#xff09; 2.Service&#xff08;服务存储&#xff09; 3.Repository&#xff08;仓库存储&#xff09; 4.Componemt&#xff08;组件存储&#xff09; 5.Configuratio…

解决Could not establish connection to : XHR failed

解决Could not establish connection to : XHR failed 问题描述 用vscode用远程连接服务器时总报上面的错误&#xff0c;用xshell和Xftp和vscode终端都可以连上&#xff0c;但是用vscode的ssh连接缺总报错&#xff0c;导致无法连接服务器进行代码调试 一、原因 原因可能是在…

【MATLAB】 数据、矩阵、行、列翻转

1.MATLAB函数fliplr 用法&#xff1a;fliplr(X) 功能&#xff1a;matlab中的fliplr函数实现矩阵的左右翻转。 fliplr(X)使矩阵X沿垂直轴左右翻转。 相关函数&#xff1a;flipud函数可以实现矩阵的上下翻转。 备注&#xff1a;matlab中提供了许多对矩阵操作的函数&#xff0c;可…

Go json 差异比较 json-diff(RFC6902)

Go json 差异比较 json-diff(RFC 6902) 毕业设计中过程中为了比较矢量图的差异而依据 RFC 6902 编写的一个包&#xff0c;现已开源&#xff1a; Json-diff 使用 go get -u github.com/520MianXiangDuiXiang520/json-diff序列化与反序列化 与官方 json 包的序列化和反序列化不…

后端开发面试题

这是一波今年7月份的大厂面试题&#xff0c;分享下&#xff5e;&#xff5e; Mybatis三级缓存 Mybatis懒加载 分布式事务 transaction gradle和maven区别 抽象类、多态 Springboot启动 ConcurrentHashMap 乐观锁、悲观锁 docker k8s常用命令 电商业务从什么维度分库分…

AcWing 95. 费解的开关(递推)

题目链接 活动 - AcWing 本活动组织刷《算法竞赛进阶指南》&#xff0c;系统学习各种编程算法。主要面向有一定编程基础的同学。https://www.acwing.com/problem/content/97/ 题解 只要第一行开关的状态确定&#xff0c;则所有开关的状态都可以被推出来。第一行开关总共有种操…

jemeter,同一线程组内,调用cookie实现接口关联

取cookie方式参考上一篇&#xff1a;jemeter&#xff0c;取“临时重定向的登录接口”响应头中的cookie-CSDN博客 元件结构 登录后要执行的接口为“api/get_event_list/”&#xff0c;在该HTTP请求下创建HTTP信息头管理器&#xff0c;配置如下&#xff1a; 执行测试后&#xff0…

【ensp实践】eNSP实战篇(4)用eNSP实验来认识什么是OSPF及OSPF配置?

OSPF目录 写在前面涉及知识一、什么是OSPF&#xff1f;二、OSPF特性&#xff08;优缺点&#xff09;2.1 OSPF优点2.2 OSPF缺点 三、OSPF实验3.1 打开ensp&#xff0c;添加设备3.2 建立连线3.3 配置及ospf命令【核心】3.3.1 配置PC机3.3.2 设置命令 3.4 验证效果3.4.1、验证OSPF…

Spring IoC如何存取Bean对象

小王学习录 IoC(Inversion of Control)1. 什么是IoC2. 什么是Spring IoC3. 什么是DI4. Spring IoC的作用 存储Bean对象1. 创建Bean2. 将Bean注册到Spring中. 取Bean对象.1. 获取Spring上下文信息使用ApplicationContext和BeanFactory的区别 2. 获取指定Bean对象 IoC(Inversion …

使用JLink仿真器实现调试打印的N种方法

方法一&#xff1a;使用MCU的串口 这是最古老也是最简单的方法。 电脑上面插一个USB转TTL&#xff0c;然后与MCU的UART_RX/UART_TX/GND连接起来。PC端再打开一个串口调试助手。两边的波特率一致&#xff0c;就可以收到MCU发过来的打印信息了。 方法二&#xff1a;使用JLink仿…

【EMNLP 2023】面向Stable Diffusion的自动Prompt工程算法

近日&#xff0c;阿里云人工智能平台PAI与华南理工大学朱金辉教授团队合作在自然语言处理顶级会议EMNLP2023上发表了BeautifulPrompt的深度生成模型&#xff0c;可以从简单的图片描述中生成高质量的提示词&#xff0c;从而使文生图模型能够生成更美观的图像。BeautifulPrompt通…

Android--Jetpack--Databinding源码解析

慢品人间烟火色&#xff0c;闲观万事岁月长 一&#xff0c;基本使用 关于databinding的基本使用请看之前的文章 Android--Jetpack--Databinding详解-CSDN博客 二&#xff0c;xml布局解析 分析源码呢&#xff0c;主要就是从两方面入手&#xff0c;一个是使用&#xff0c;一个…

STM32F407-14.1.0-01高级定时器简介

TIM1 和 TIM8 简介 高级控制定时器&#xff08;TIM1 和 TIM8&#xff09;包含一个 16 位自动重载计数器&#xff0c;该计数器由可编程预分频器驱动。 此类定时器可用于各种用途&#xff0c;包括测量输入信号的脉冲宽度&#xff08;输入捕获&#xff09;&#xff0c;或者生成输出…

微软NativeApi-NtQuerySystemInformation

微软有一个比较实用的Native接口&#xff1a;NtQuerySystemInformation&#xff0c;具体可以参考微软msdn官方文档&#xff1a;NtQuerySystemInformation&#xff0c; 是一个系统函数&#xff0c;用于收集特定于所提供的指定种类的系统信息。ProcessHacker等工具使用NtQuerySys…

Javascript 数组array赋值与取值

Javascript 数组array赋值与取值 目录 Javascript 数组array赋值与取值 一、数组元素的赋值 1、在创建Array对象时直接赋值 2、利用Array对象的元素下标对数组进行赋值 二、数组元素的获取 一、数组元素的赋值 对数组元素赋值共有2种方法&#xff1a; &#xff08;1&am…

每日一题,头歌平台c语言题目

任务描述 题目描述:输入一个字符串&#xff0c;输出反序后的字符串。 相关知识&#xff08;略&#xff09; 编程要求 请仔细阅读右侧代码&#xff0c;结合相关知识&#xff0c;在Begin-End区域内进行代码补充。 输入 一行字符 输出 逆序后的字符串 测试说明 样例输入&…

项目实战第四十七讲:易宝支付对接详解(保姆级教程)

易宝支付对接(保姆级教程) 为了实现项目的支付需求,公司选择了易宝支付进行对接,本文是项目实战第四十七讲,详解易宝支付对接。 文章目录 易宝支付对接(保姆级教程)1、需求背景2、流程图3、技术方案4、相关接口4.1、入驻相关(商户入网)4.2、账户相关接口(充值、提现、…