思维拉练前后端分离诞生记-系统学习八

简介: 通过5+6的需求的实现,以及不同版本的变化带来思考的过程;希望您用餐愉快。

一、背景


通过5+6的需求的实现,以及不同版本的变化带来思考的过程;希望您用餐愉快。


二、介绍


第一练:实现5+6需求


/**
 * 第一练
 * 计算5与6的和
 */
public class a0001 {
    public static void main(String[] args) {
        System.out.println(5+6);
    }
}


主题讨论:《从1.1 《版本1:计算5和6的和》中,这样极其简单的代码,你写的多吗?从中你又能发现什么?》


参考回复:代码写死了,不具备复用性,不利于后续的扩展


第二练:简单变化的开始


/**
 * 第二练:简单变化的开始
 * 思维拉力:计算5与6的和;
 */
public class a0002 {
    public static void main(String[] args) {
        int a ,b;
        a = 5;
        b = 6;
        System.out.println(a+b);
    }
}


主题讨论:《从版本1到版本2中代码发生了非常巨大的变化,来说说你发现的巨大变化都有哪些,以及你能由此想到的更深入的知识点还有哪些?》


参考回复:将具体数值封装到变量中;复用了逻辑;可以实现任意两数的相加


第三练:质的变化


/**
 * 思维拉练:质的变化
 * 思维拉力:计算5与6的和。
 */
public class a0003 {
    public static void main(String[] args) {
        int a,b,c;
        a = 5;
        b = 6;
        //----------------
        c = a+b;
        //----------------
        System.out.println(c);
    }
}


主题讨论:独立思考如下有趣的话题:1、对比工程2的实现与工程3的实现,代码和形式上有哪些不同?2、从软件工程学的角度看,非常巨大的进步是什么?


参考回复:1.把逻辑做了抽象、将输出做了封装2.使得输出可以成为任何逻辑的组合


期中训练:


通过前三个过程的学习,现在如果给你一个需求,让你去设计一个四+五的功能,你会如何设计?


参考回复:通过前三个过程的训练,让我们学会了抽象的概念,封装的概念,为逻辑代码和功能的复用奠定一个很好的基础。当给我们一个具体要解决问题的时候,我们要通过这些训练能够想象将来业务场景的变化,使得我们的代码能够适应未来的变化,而不仅仅适应眼前的需求。


未雨绸缪;运筹帷幄之中决胜千里之外.


第四练:变是永远不变的


import javax.swing.*;
import java.io.IOException;
/**
 * 思维拉练:变是永远不变的
 * 思维拉力:计算5与6的和。
 */
public class a0004 {
    public static void main(String[] args) throws IOException {
        int a,b,c;
        a = Integer.valueOf(JOptionPane.showInputDialog("输入a的值:"));
        b = Integer.valueOf(JOptionPane.showInputDialog("输入b的值:"));
        //----------------
        c = a+b;
        //----------------
        System.out.println(c);
    }
}


主题讨论:版本4的主题讨论:《结合版本4的伪代码示例,请结合你目前的软件工程知识,对此代码产生了变化进行分析》


参考回复:前后端的分离使得我们有机会创造更加丰富的前端,使得数据的输入有了更多的通道实现了输入由单一的串行变成了多通道的并行。


创造来自于想象,而不是仅仅依赖于客观。


第五练:多此一举吗?


import javax.swing.*;
import java.io.IOException;
/**
 * 思维拉练:多此一举吗?
 * 思维拉力:计算5与6的和。
 */
public class a0005 {
    public static void main(String[] args) throws IOException {
        int a,b,c;
        a = Integer.valueOf(JOptionPane.showInputDialog("输入a的值:"));
        b = Integer.valueOf(JOptionPane.showInputDialog("输入b的值:"));
        //----------------
        c = a+b;
        //----------------
        JOptionPane.showMessageDialog(null,c);
    }
}


主题讨论:版本5主题讨论:《看了版本5和版本4的代码示例,通过1~4的学习和提高,展现一下你的聪明才智,来描述一下从版本4到5,它们之间这个巨大的变化》


参考回复:完整的前后端分离,通过扩充msgbox,实现并行多通道的扩展。


一个系统完整的前后端分离,就此诞生了。


三、扩展


什么是前端?


答:即网站前台部分,运行在PC端,移动端等浏览器上展现给用户浏览的网页


静态网页的诞生


1989年,在欧洲粒子物理实验室(粒子物理研究通常与来自世界各地的研究所进行合作)的IT部门工作的Tim Berners-Lee向其领导提出了一项名为Information Management: A Proposal的提议:使来自世界各地的远程站点的研究人员能够组织和汇集信息,在个人计算机上访问大量的科研文献,并建议在文档中链接其他文档,这就是Web的原型。

1990年,Tim以超文本语言HTML为基础在NeXT电脑上发明了最原始的Web浏览器。

1991年,Tim作为布道者在Internet上广泛推广Web的理念,与此同时,美国国家超算应用中心(National Center for Supercomputer Applications)对此表现出了浓厚的兴趣,并开发了名为Mosaic的浏览器,于1993年4月进行了发布。

1994年5月,第一届万维网大会在日内瓦召开。

1994年7月,HTML2规范发布。

1994年9月,因特网工程任务组(Internet Engineering Task Force)设立了HTML工作组。

1994年11月,Mosaic浏览器的开发人员创建了网景公司(Netscape Communications Corp.),并发布了Mosaic Netscape 1.0 beta浏览器,后改名为Navigator。

1994年底,由Tim牵头的万维网联盟(World Wide Web Consortium)成立,这标志着万维网的正式诞生。

此时的网页以HTML为主,是纯静态的网页,网页是“只读”的,信息流只能通过服务器到客户端单向流通,由此世界进入了Web 1.0时代。

JavaScript的诞生

1995年,网景工程师Brendan Eich花了10天时间设计了JavaScript语言。起初这种脚本语言叫做Mocha,后改名LiveScript,后来为了借助Java语言创造良好的营销效果最终改名为JavaScript。网景公司把这种脚本语言嵌入到了Navigator 2.0之中,使其能在浏览器中运行。

与此相对的是,1996年,微软发布了VBScript和JScript。JScript是对JavaScript进行逆向工程的实现,并内置于Internet Explorer 3中。但是JavaScript与JScript两种语言的实现存在差别,这导致了程序员开发的网页不能同时兼容Navigator和Internet Explorer浏览器。Internet Explorer开始抢夺Netscape的市场份额,这导致了第一次浏览器战争。

1996年11月,为了确保JavaScript的市场领导地位,网景将JavaScript提交到欧洲计算机制造商协会(European Computer Manufacturers Association)以便将其进行国际标准化。

1997年6月,ECMA以JavaScript语言为基础制定了ECMAScript标准规范ECMA-262。JavaScript是ECMAScript规范最著名的实现之一,除此之外,ActionScript和JScript也都是ECMAScript规范的实现语言。自此,浏览器厂商都开始逐步实现ECMAScript规范。

1998年6月,ECMAScript2规范发布,并通过ISO生成了正式的国际标准ISO/IEC 16262 。

1999年12月,ECMAScript3规范发布,在此后的十年间,ECMAScript规范基本没有发生变动。ECMAScript3成为当今主流浏览器最广泛使用和实现的语言规范基础。

第一次浏览器战争以IE浏览器完胜Netscape而结束,IE开始统领浏览器市场,份额的最高峰达到2002年的96%。随着第一轮大战的结束,浏览器的创新也随之减少。


前端和后端的作用是什么?


前端:

1.网页的结构层(structural layer)由 HTML 或 XHTML 之类的标记语言负责创建

2.网页的表示层(presentation layer) 由 CSS 负责创建

3.网页的行为层(behavior layer)负责回答“内容应该如何对事件做出反应”这一问题


html是主体,装载各种dom元素;css用来装饰dom元素;javascript控制dom元素。

用一扇门比喻三者间的关系是:html是门的门板,css是门上的油漆或花纹,javascript是门的开关;

后端:

1.接收前端数据,把数据写在服务器的文件里面。

2. 把数据返回给前端。


四、总结


在思维拉练过程中学习了封装和抽象;用现在的需求结合未来的眼光来满足长远的变化;通过前后端分离的过程体会到事物发展的逻辑。

相关文章
|
存储 大数据 分布式数据库
大数据分析的下一代架构--IOTA架构设计实践
IOTA的特点: [x] 去“ETL”化 [x] 高效:时时入库即时分析 [x] 稳定:经过易观5.8Pb,5.2亿月活数据锤炼 [x] 便捷:支持SQL级别的二次开发和UDAF定义 [x] 扩充性强:组件基于Apache开源协议,可支持众多开源存储对接
19293 0
|
2月前
|
机器学习/深度学习 数据采集 传感器
【WOA-CNN-LSTM】基于鲸鱼算法优化深度学习预测模型的超参数研究(Matlab代码实现)
【WOA-CNN-LSTM】基于鲸鱼算法优化深度学习预测模型的超参数研究(Matlab代码实现)
211 0
|
6月前
|
机器学习/深度学习 算法 PyTorch
Perforated Backpropagation:神经网络优化的创新技术及PyTorch使用指南
深度学习近年来在多个领域取得了显著进展,但其核心组件——人工神经元和反向传播算法自提出以来鲜有根本性突破。穿孔反向传播(Perforated Backpropagation)技术通过引入“树突”机制,模仿生物神经元的计算能力,实现了对传统神经元的增强。该技术利用基于协方差的损失函数训练树突节点,使其能够识别神经元分类中的异常模式,从而提升整体网络性能。实验表明,该方法不仅可提高模型精度(如BERT模型准确率提升3%-17%),还能实现高效模型压缩(参数减少44%而无性能损失)。这一革新为深度学习的基础构建模块带来了新的可能性,尤其适用于边缘设备和大规模模型优化场景。
307 16
Perforated Backpropagation:神经网络优化的创新技术及PyTorch使用指南
|
存储 前端开发 JavaScript
前端技术深度探索:从基础到现代框架的实践之旅
前端技术深度探索:从基础到现代框架的实践之旅
246 3
|
8月前
|
数据采集 存储 安全
Python爬虫实战:利用短效代理IP爬取京东母婴纸尿裤数据,多线程池并行处理方案详解
本文分享了一套结合青果网络短效代理IP和多线程池技术的电商数据爬取方案,针对京东母婴纸尿裤类目商品信息进行高效采集。通过动态代理IP规避访问限制,利用多线程提升抓取效率,同时确保数据采集的安全性和合法性。方案详细介绍了爬虫开发步骤、网页结构分析及代码实现,适用于大规模电商数据采集场景。
|
8月前
|
JSON 数据格式
基于 PAI-ArtLab 使用 ComfyUI 生成高精度人物手办
通过一张照片,即可在PAI ArtLab平台上生成专属手办形象,让女生更萌、男生更帅!实验分三步:首先登录阿里云完成实名认证并进入PAI ArtLab平台领取免费试用资源;接着使用ComfyUI加载工作流,上传半身肖像照生成初步结果;最后通过提示词或更换模型进阶创作,如添加太阳镜或切换二次元风格。整个过程简单快捷,约需2-3分钟,支持查看任务进度和语言切换。
|
11月前
|
机器学习/深度学习 人工智能 算法
【AI系统】框架编程范式
编程范式是软件工程中一类典型的编程风格,如函数式、命令式、声明式、面向对象等。它们影响着开发者对程序执行的理解。本文探讨了两种主要的编程范式——声明式编程与命令式编程,特别是在AI框架中的应用,如TensorFlow的声明式编程和PyTorch的命令式编程,分析了这两种范式对AI框架架构设计的影响及主流AI框架在这两种范式上的差异。
220 3
【AI系统】框架编程范式
|
11月前
|
人工智能 数据挖掘 程序员
设计师的技能要求:如何在快速变化的环境中保持竞争力
设计不仅是美学的追求,更是解决问题的过程。本文从设计者的角度探讨了现代设计的演变,包括手工艺术、工业革命、信息时代及用户体验设计的兴起,分析了现代设计的特征如用户中心、跨学科协作和持续迭代,以及当前面临的挑战和未来趋势,强调了设计师应具备的适应能力和创新能力。
|
缓存 安全 前端开发
Electron on macOS: 揭秘 MacUpdater 如何实现无缝自动更新?
本文首发于微信公众号“前端徐徐”,详细探讨了 Electron 应用在 macOS 平台上的更新原理。文章分析了 `MacUpdater` 类的实现,包括与 Electron 原生更新器的集成、更新检测和下载、代理服务器管理、环境适配、安全性保障、错误处理和日志记录、更新安装流程控制以及缓存管理等关键功能。通过这些技术细节,展示了如何在 macOS 上实现高效、安全的 Electron 应用更新。
488 0
Electron on macOS: 揭秘 MacUpdater 如何实现无缝自动更新?
|
存储 算法 Java
【底层服务/编程功底系列】「手把手教学系列」带你打造一个属于自己的规则引擎服务,打破任何业务难题(逻辑模型和API设计)(一)
【底层服务/编程功底系列】「手把手教学系列」带你打造一个属于自己的规则引擎服务,打破任何业务难题(逻辑模型和API设计)
594 1