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

目录

• ​​一、背景​​
• ​​二、介绍​​

• ​​第一练:实现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. 把数据返回给前端。

四、总结

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