Web前端从入门到精通-1 高级语言基础以及前端简介
本系列的第一篇文章,名字叫“高级语言基础以及前端简介”,为何写这样一篇文章呢?我希望能为大家扫清一些盲点,因为据我所接触的很多前端的朋友以及同事,有些是从设计师转行而来的,有些是从后台过来的,有些则之前的工作和程序八竿子打不着,即使就是之前做开发的,也对计算机底层的一些运行逻辑了解的不太多,而这部分东西又和我们日常开发没有直接的关系,很多人都忽略了这一点,所以有些最基础的知识需要普及一下,这样对于今后的理解非常有帮助。
不知道大家思考过这样一个问题没有,我们的电脑能给我们展现丰富多彩的内容,比如世界各地的语言、文字、符号等等。
那么这样一台小小的电脑为何能容纳这么多的东西,这其中呢,必然有管理这些信息的一些手段。
那么计算机是如何管理我们的信息的呢?例如在电脑上显示"CSS"这三个字母,计算机真的是在自己的肚子里面存了这三个字母然后吐出来到屏幕上给咱们的么?明显不是
计算机只能识别由0和1组成的二进制编码,所以我们在电脑上看到的任何信息在计算机内部都是由0 1 0 1按照某种顺序存储的
那现在问题又来了,你内部存的是0 1 0 1,但是显示的东西又有文字、又有图片、又有视频,这些纷繁复杂的信息和你的二进制0 1编码必然有一个一一对应的关系
好的,再说一遍哈,计算机展现给我们的这些乱七八糟的东西(文字、图片、视频)和计算机内部存的一段一段的编码一定是一一对应的,还是上面的例子,我们在屏幕上显示CSS这三个字母,那么很有可能在计算机内部是这样来的
01000011 C
01010011 S
01010011 S
而且相同的显示部分,对应着相同的二进制表示,例如上面的两个”S”都对应01010011,然后搞计算机的这伙儿人就给这堆0 1 0 1起了一个名字,叫做机器语言
那么计算机呢,只认得机器语言,只识别0 1二进制编码,拿到这些二进制码之后内部轮回改造一下,扔到屏幕上给我们看,我们就知道怎么回事了
说到这里,相信大家应该有个感觉,什么感觉呢?从理论上来讲,我们按照某种顺序写一堆0 1 0 1就可以直接和计算机沟通了,例如我想要显示字母C,就写下 01000011 计算机就给我们吐出来C,但这个时候想必大家也感觉到了,好像似乎是有那么一点点麻烦,一个字母都要记8位数字,如果这样去开发一个项目的话,只能呵呵了。除此之外,我的这个程序好不容易在这台电脑上跑起来了,拿到别的电脑上试一试吧,结果会让你很happy的,机器语言 机器语言顾名思义,它跟机器有关系,因为0 1 0 1一定是按照你的那台计算机的各种硬件环境来走的,但是你敢保证全世界的电脑和你家的一模一样么。所以呢这个时候有了高级语言的出现。
说到高级语言,大家一定很熟悉了,我们平时听到的和我们的学校里开设的C C++ Java C#等等都是高级语言,那么高级语言和机器语言之间有什么区别和联系呢?
实际上是这样的,我们人类是为了方便开发才发明的高级语言,所以高级语言必然解决了机器语言的一些不足之处,例如:机器语言只是杂乱无章的0 1 0 1,让人看上去毫无头绪,根本不知道脑袋尾巴在哪儿,所以高级语言的第一个特点就是规范化,哪儿是开头,哪儿是结尾,都规定的清清楚楚,这个也就是所谓的语法。其次,我们上面说了,机器语言只要一换机器,就over了,所以高级语言是和机器无关的。当然说到这里,我有必要说一句,我给大家讲东西的时候,以方便理解为主,现在我说的这些话都是为了大家方便理解,将来大家哪一天功成名就了再看这个教程的时候可能就会说,这讲的是个毛啊,你拿iOS的程序跑到Android的机器上能跑么,还有前面,哪能直接从机器语言到高级语言啊,中间还有汇编语言呢。。。等等,还是那句话,纯粹是为了大家方便理解,因为我相信看这个教程的哥们儿们有很多可能都没什么基础,可能没有上过大学的,所以还希望大家能够理解。
说到这里呢,我们大家脑袋里面大概明白高级语言是怎么一回事了,当然,表现在我们日常工作中就是一行一行的代码了,那这一行一行的代码一定要放到一个文件当中,这个文件就叫源文件,根据语言的不同,源文件有不一样的格式,即不同的扩展名。
到了这一步之后呢,肯定大家又有疑问了,那高级语言到低级语言之间一定有一个转换的过程吧,没错,我们的编译器就是干这个事的,所以不用我说大家也能猜到了编译器是干嘛用的呢?就是将我们用高级语言写好的程序轮回改造一遍变成机器能够识别的机器语言
讲到这里,又有人提出问题来了,你突然冒出编译器这么一东西,那编译器在哪里呢?最开始我写这个教程的时候为了解释这个问题是胡说八道了几句的,后来我就把我胡说的那几句给去了,这里的话这个问题先放一放,因为现在说大家都不懂,所以干脆不说,也不误导大家了,那么接着我们的话题来
编译器干这个活儿的过程就是编译
把我们上面说的总结一下,可以归结为下面的这张图
说到这儿那么我们今天的话题也就正式拉开帷幕了,我们这门课的名字叫web前端由入门到精通,分为三部分内容——HTML、CSS、Javascript,这三个东西,也是三门高级语言,
先从我们的HTML开始说起,HTML源文件的扩展名就是.html,那么我们的HTML在哪里编译呢——浏览器,我们新建一个HTML文件对它作一些编辑之后双击打开它会发现它就在浏览器里面打开了,在双击的一瞬间编译就开始了,编译完了之后计算机再去解析编译完了的一堆0 1二进制编码,再展现到浏览器当中,这就是我们.html文件的运行过程,如果有其他语言基础(比如Java、C#等)的同学,应该会有感觉我们的HTML是比较特殊的,具体的话,等大家学习慢慢深入就体会到了,在此我就不多说了。
好了,大家可能看到我把浏览器加粗了,很多同学可能会想,我们天天拿浏览器这个东西上网呢,有什么好说的么,有,这个真的有,因为我们前端的工作几乎天天都是在和各种各样浏览器作斗争,换句话说,我们做出的网页如果有些地方考虑不周到的话在不同的浏览器下可能显示会不一样,而兼容问题就是这样产生的。所以呢,非常有必要和大家分享一下关于浏览器的一些东西
首先,这么说吧,浏览器,既然有这个东西,那肯定是有人造出来它的,这玩意儿不可能玩儿星际穿越突然降临人世就有了,那么是谁生产了浏览器呢?
谷歌 chrome浏览器
火狐 FireFox浏览器
苹果 Safari浏览器
欧鹏 Opera浏览器
微软 IE系列的浏览器
基本到此为止了,到这儿,有的同学应该按捺不住激动的心情说,哎,不对,还有啊,我们中华人民共和国的360啊 搜狗啊 猎豹啊这些呢?
实际上这些浏览器只是将外表改变了一下,而实际上内核还是用的上述几种浏览器的,比如360浏览器就有两种模式,好像一种是什么普通模式、还有一种叫极速模式,就分别模拟了IE和chrome两种内核的浏览器,所以我们主要就考虑以上这几种浏览器就OK了
在这里面呢,Opera浏览器在中国国内很少有人使用,即使在国外使用率也比较低,所以这个浏览器基本上可以忽略,而苹果的Safari浏览器和谷歌的chrome浏览器使用的内核都一样,都是WebKit内核的,所以大部分表现也都差不多,注意我的用词,是大部分,这样说下来,浏览器基本上可以归结为三种
IE FF Chrome,这三种浏览器算是当今主流的三种浏览器了,而万恶之源的IE浏览器根据版本的不同大概可以划分为两大阵营:
IE8及以下 IE9及以上
为什么以8和9作为分界线呢?8和9之间有很大的差别吗?没错,差别非常大,我们在学习CSS的时候可能还体会不到这种差别,但是在学Js的时候就会越来越有一种感觉,那就是IE8实在太扯淡了,当然这里为什么没有提到IE7 IE6呢?因为当前IE6 7的使用量已经非常之少了,所以IE6 7也已经不再考虑了,像我刚学前端那会儿,IE6 7还在市场上很风光潇洒的驰骋于家家户户的电脑上,哎哟,那个时候兼容这两个浏览器真是让人很蛋疼。好的,不多说了,下节课呢就进入我们的正题。