【你也能从零基础学会网站开发】Web建站之javascript入门篇 认识JavaScript脚本语言
🚀 个人主页 极客小俊
✍🏻 作者简介:web开发者、设计师、技术分享
🐋 希望大家多多支持, 我们一起学习和进步!
🏅 欢迎评论 ❤️点赞💬评论 📂收藏 📂加关注
什么是脚本语言
脚本语言是一种应用程序扩展语言,用于系统的扩展,使其按用户的意愿去运行。
所有的基础功能由系统提供,脚本语言在更高一层次描述如何调用系统的接口。
其中脚本语言的分类:嵌入式 和 非嵌入式
JavaScript能做什么
JavaScript是一种网页编程技术,大部分使用者将它用于创建动态交互网页,是一种使用简单,功能强大的编程语言!
在Web页面上,目前主要分为三大块,也就是俗称的前端开发三大件:HTML, CSS, JavaScript
HTML
HTML类似于结构,你可以用HTML定义一些结构,包括header, footer, sidebar或者类似的,就像你在网页中看到的不同的“块”(仅是视觉上的块,并不是块级元素)
CSS
CSS则用于定义样式和布局,比如字体,字号,“块”的大小,位置
JavaScript
那么JavaScript具体能做什么呢?
见的说JavaScript做动态的东西, 动态的东西包括但不限于:表单提交,样式改变,用户操作监控与响应
举个栗子
比如用户点击后处理某些事情,还有就是自动化一些事情
比如在网页完全加载完成后,自动发送一些数据或者从服务器端获取一些数据并展示在页面上
这些都可以使用JavaScript
来完成!
从目前新手刚刚接触js
来看它主要能给刚刚接触它的人实现一些简单的功能
如下:
- 客户端表单合法性验证
- 浏览器对象的调用
- 浏览器事件的触发
- 网页特殊显示效果制作
另外目前有了Node.js
,人们才会想到把JavaScript用在服务器端,或者说人们想到把JavaScript放到服务器端,才有了Node.js
让JavaScript
变得更加强大!
题外话
一说服务器端,大多会想到大数据处理,并发,线程,进程或者其他的概念。
在这里明确一下,Node.js适合做的是服务器端前端的响应,比如用户请求来了,推一条数据回去,或者用户数据来了,记录一些东西。
如果你希望收集一些用户的数据,然后在后面做分析,那么这一类的工作,最好不要让Node.js,或者不要让JavaScript来做。
JavaScript和其它语言的异同
JavaScript是一种基于对象和事件驱动的解释性脚本语言,具有与Java和C语言类似的语法
JavaScript和其他语言脚本语言一样,都应用于高级任务控制,大多都是解释执行,都属于弱类型语言
,数据类型在运行时决定,实现自动内存管理机制,资源的分配策略相似。
但不同的是,JavaScript运行于浏览器中,主要用于Web开发,这方面它和VBScript一样
而其他众多脚本语言都运用于特定的软件环境以帮助实现任务自动化,
例如flash的ActionScript,使用该脚本语言可以使动画产生很多行为操作 自动化人物处理等等!
JavaScript的特点
简洁易用,JavaScript与Java有类似的语法, 可以使用任何文本编辑工具编写, 只需要浏览器就可以执行程序,你看多方便!
JavaScript基于对象内置大量现成对象,我们可以编写少量程序可以完成目标!
另外之前说了JavaScript
是一个 弱类型语言,对于刚刚接触的新手,你只要记住一点,无需进行严格的变量声明的一些脚本语言都可以归类为弱类型
而JavaScript
就是其中之一, 当然还有php
等后端脚本语言也是一样的!
什么是编译执行和解释执行的语言?
我会尽量用最简单、最通俗易懂的方式来解释编译执行
和解释执行
让大家能听明白!
编译执行
编译执行就像做菜前的准备工作。首先,你会把食材(源代码)准备好,然后按照菜谱(编译器)的指导,把这些食材做成一道道菜(可执行文件)。等这些菜都准备好了,你就可以直接端上桌(运行程序)给客人吃了。这个过程就是编译执行
你可以简单的这样理解!
编译的好处是,一旦菜(程序)做好了,客人吃起来就很快,因为都是现成的。
但如果你想要改菜谱(修改源代码),那就得重新做一遍菜(重新编译)。
解释执行
解释执行则像是现场做菜给客人吃。每次客人点什么菜(运行什么源代码),厨师(解释器)就现场按照菜谱(源代码)来做(解释执行)。
这样做的好处是,如果客人突然想改菜(修改源代码),厨师可以马上改,因为都是现场做的。
但缺点是,如果客人点的菜很复杂或者很多,那厨师做起来可能会比较慢(执行速度慢)。
所以简单来说:
编译执行
先做成菜,再端上桌吃, 修改食材要重新做菜。
解释执行
现场做菜给客人吃。修改食材可以马上改,但做菜可能会慢。
而我们今天要说的主角JavaScript
就是一个解释执行的语言,事先不编译 逐行执行!
这意味着JavaScript代码在运行时由解释器逐行读取并执行,而不是像编译型语言那样先被编译成机器代码再执行。因此,当你修改JavaScript代码时,不需要像编译型语言那样重新编译整个程序,只需要重新加载或刷新页面,解释器就会重新解释并执行修改后的代码, 其实这样一来,对于刚刚开始学习编程的新手倒是轻松了不少!
JavaScript和Java的区别
首先JavaScript与Java运行方式不一样: JavaScript是解释执行,而Java是编译,解释执行!
记住JavaScript并不是Java的简化版本,虽然有一些逻辑运算符、语句结构类似, 但是变量申明、对象调用等不同!
JavaScript和Java功能实现不一样: JavaScript通过浏览器实现程序功能, Java通过Java虚拟机实现程序功能!
为什么起名叫 JavaScript
?
javascript最初其实不叫这个名字,而是网景取名为Livescript
但是当时Java语言非常红火,并且Netscape网景与Sun公司合作过,网景公司高层管理层希望Livescript外观看起来像Java语言,因此改名为JavaScript! 所以网景公司是希望借Java的名气来推广这个javascript,但事实上JavaScript除了语法上有点像 Java之外,其他部分基本上没任何关系
反正你就记住java
和javascript
压根就没有任何关系!
第一个JavaScript程序
准备知识:
我们要使用一个叫document对象
中的write方法
将字符串Hello World
输出显示在浏览器客户区里。
或者也可以使用window对象
的alert方法
以消息框的形式输出信息
当然还可以使用我们最经典的控制台打印console.log()
方法
刚刚开始学习JavaScript
的时候,这几个方法 最好是记一下!
我们只需要把JavaScript程序嵌入HTML
文档中, 最常用方法就是将代码放在<script>
标签对中 。
JavaScript代码在HTML文档中的形式。
代码包含于<script>和</script>
标记对,然后嵌入到 HTML文档中, 并且最好写到Head标签
中去!
例如
01 <html> <!---------HTML文档开始------->
02 <head> <!---------文档头开始--------->
03 <title> <!---------标题开始----------->
04 </title> <!---------标题结束----------->
05 </head> <!---------文档头结束--------->
06 <body> <!---------文档体开始---------->
07 <script language="JavaScript"> <!---------脚本程序------------>
08 // JavaScript程序语句
09 // ......
10 </script> <!---------脚本结束------------>
11 </body> <!---------文档体结束----------->
12 </html>
当然后期我们也可以通过<script>
标记的 src属性
链接外部的 JavaScript脚本文件
也可以!
那么我们第一个经典的程序如下:
01 <html> <!---------HTML文档开始----------->
02 <body> <!---------文档体开始------------->
03 <script> <!---------脚本程序--------------->
04 document.write("Hello World!"); // 输出经典的Helloworld
05 </script> <!---------脚本结束--------------->
06 </body> <!---------文档体结束------------->
07 </html> <!---------HTML文档结束----------->
然后打开浏览器运行一下,你这个html页面,看看效果, 我这里使用的编辑器是WebStorm
如图
看到了吧,就这么简单,有浏览器就能运行JavaScript
而且基本上主流浏览器都支持,放心食用😈!
浏览器对JavaScript的支持
在互联网发展的过程中,几大浏览器之间也存在激烈的竞争。JavaScript是Netscape公司的技术,其它浏览器并不能和Navigator一样良好的支持JavaScript,因为得不到使用许可。微软公司为能使其IE浏览器能抢占一定市场份额,于是在IE中实现了称为JScript的脚本语言,其兼容JavaScript,但是和JavaScript间仍然存在版本差异。因此,编程人员在编码时仍然考虑不同浏览器间的差别。
我们其实可以用一些JavaScript
代码来检测一下当前所用的浏览器的一些信息
document.write("名称:" + navigator.appName+"<br>"); // 浏览器名称
document.write("版本号:" + navigator.appVersion+"<br>"); // 浏览器版本号
document.write("发行代号:"+navigator.appCodeName+"<br>"); // 浏览器的内部发行代号
你可以去各种浏览器中去尝试运行一下以上代码所打印的效果是什么!
JavaScript编辑器的选择
关于编辑器的选择,这里我还是建议刚刚入门的朋友可以使用Dreamweaver
来编写,
当然你也可以根据个人喜好使用以下工具:
记事本
vscode
Eclipse
JBuilter
HBuilter
WebStorm
EditPlus
..... 等等....
编辑器有很多,我这里就不过多挨个去介绍了,但是有一点大家一定要记住:
我曾经说过的,不要去纠结要使用什么编辑器,重点是学好语言本身,你是程序员,不是倒卖软件的,也不是用这些软件去给小白装逼用的,😈😈😈
"👍点赞" "✍️评论" "收藏❤️"
欢迎一起交流学习❤️❤️💛💛💚💚
好玩 好用 好看
的干货教程可以
点击下方关注❤️
微信公众号❤️
说不定有意料之外的收获哦..🤗嘿嘿嘿、嘻嘻嘻🤗!
🌽🍓🍎🍍🍉🍇