目录
有关JavaScript的知识
JavaScript的优点
JavaScript的领域
JavaScript的组成
JavaScript的特点
第一个JavaScript程序
在 HTML 文档中嵌入 JavaScript 代码
在脚本文件中编写 JavaScript 代码
JavaScript内容
Html内容
JavaScript 代码执行顺序
JavaScript中的几个重要概念
标识符
关键字
保留字
区分大小写
直接量
JS(单行 or 多行)注释
有关JavaScript的知识
关于前端网页的开发,Html是搭建页面的结构和内容
Css是美化页面的样式
JavaScript是给页面添加动态界面和动态数据
JavaScript的优点
JavaScript 是最流行的客户端脚本语言,有着简单易学的特点。学有所成后,可以使用一些基于 JavaScript 的框架来开发前端或后端应用程序;
JavaScript 可以在 Web 浏览器中运行,不需要配置任何特殊的运行环境;
JavaScript 的应用非常广泛,例如移动应用开发、桌面应用开发、Web 游戏开发等都会用到
JavaScript 有着大量的优质框架和库,借助这些框架和库可以大大减少的开发时间。
JavaScript的领域
JavaScript 可以用于 Web 开发的各个领域,例如:
Web 应用开发:日常生活中我们所浏览的网页都是由 HTML、CSS、JavaScript 构成的,通过 JavaScript 可以实时更新网页中元素的样式,并可以实现人与网页之间的交互(例如监听用户是否点击了鼠标或按下了某个按键等),还可以在网页中添加一些炫酷的动画;
移动应用开发:除了可以进行 Web 应用开发外,JavaScript 还可以用来开发手机或平板电脑上的应用程序,而且我们还可以借助一些优秀的框架(例如 React Native),让开发更加轻松;
Web 游戏:我们在网页中玩过的那些小游戏,都可以使用 JavaScript 来实现;
后端 Web 应用开发:以前我们都是使用 JavaScript 来进行 Web 应用程序前端部分的开发,但随着 Node.JS(一个 JavaScript 运行环境)的出现,使得 JavaScript 也可以用来开发 Web 应用程序的后端部分。
JavaScript的组成
完整的 JavaScript 是由以下三个部分组成:
核心(ECMAScript):提供语言的语法和基本对象;
文档对象模型(DOM):提供处理网页内容的方法和接口;
浏览器对象模型(BOM):提供与浏览器进行交互的方法和接口。
JavaScript的特点
1) 解释型脚本语言
JavaScript 是一种解释型脚本语言,使用 JavaScript 编写的代码不需要编译,可以直接由浏览器解析运行。
2) 面向对象
JavaScript 是一种面向对象语言,使用 JavaScript 不仅可以创建对象,也能操作使用已有的对象。
3) 弱类型
JavaScript 是一种弱类型的编程语言,对使用的数据类型没有严格的要求,例如可以将一个变量初始化为任意类型,也可以随时改变这个变量的类型。
4) 动态性
JavaScript 是一种采用事件驱动的脚本语言,它不需要借助 Web 服务器就可以对用户的输入做出响应,例如我们在访问一个网页时,通过鼠标在网页中进行点击或滚动窗口时,通过 JavaScript 可以直接对这些事件做出响应。
5) 跨平台
JavaScript 不依赖操作系统,在浏览器中就可以运行。因此一个 JavaScript 脚本在编写完成后可以在任意系统上运行,只需要系统上的浏览器支持 JavaScript 即可。
第一个JavaScript程序
在 HTML 文档中嵌入 JavaScript 代码
第1步,新建 HTML 文档
第2步,在
<head>
标签内插入一个<script>
标签。第3步,为
<script>
标签设置type="text/javascript"
属性。第4步,document 表示网页文档对象;
document.write() 表示调用 Document 对象的 write() 方法,
在当前网页源代码中写入 HTML 字符串
"<h1><h1>Helloworld<h1></h1>"
。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script>
document.write("<h1>Helloworld<h1>")
</script>
</head>
<body>
</body>
</html>
在脚本文件中编写 JavaScript 代码
第1步,新建文本文件,保存为 test.js。注意,扩展名为
.js
,它表示该文本文件是 JavaScript 类型的文件。第2步,打开 test.js 文件,在其中编写如下 JavaScript 代码。
第3步,新建 HTML 文档,保存为 test.html。
第4步,在
<head>
标签内插入一个<script>
标签。定义 src 属性,设置属性值为指向外部 JavaScript 文件的 URL 字符串
JavaScript内容
alert("hello world")
Html内容
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script>
document.write("<h1>Helloworld<h1>")
</script>
<script src="/first.js"></script>
</head>
<body>
</body>
</html>
JavaScript 代码执行顺序
浏览器在解析 HTML 文档时,将根据文档流从上到下逐行解析和显示。
JavaScript 代码也是 HTML 文档的组成部分,因此 JavaScript 脚本的执行顺序也是根据
<script>
标签的位置来确定的,JavaScript 代码从上到下逐步被解析。
JavaScript中的几个重要概念
标识符
合法的标识符应该注意以下规则:
第一个字符必须是字母、下划线(_)或美元符号($)
除了第一个字符外,其他位置可以使用 Unicode 字符。一般建议仅使用 ASCII 编码的字母,不建议使用双字节的字符
不能与 JavaScript 关键字、保留字重名
可以使用 Unicode 转义序列
关键字
break | delete | if | this | while |
---|---|---|---|---|
case | do | in | throw | with |
catch | else | instanceof | try | default |
continue | finally | new | typeof | function |
void | for | return | var | switch |
保留字
保留字就是 JavaScript 语言内部预备使用的一组名字(或称为命令)。这些名字目前还没有具体的用途,是为 JavaScript 升级版本预留备用的,建议用户不要使用
abstract | double | goto | native | static |
---|---|---|---|---|
boolean | enum | implements | package | super |
byte | export | import | private | synchronized |
char | extends | int | protected | throws |
class | final | interface | public | transient |
const | float | long | short | volatile |
区分大小写
JavaScript 严格区分大小写,所以 Hello 和 hello 是两个不同的标识符。
为了避免输入混乱和语法错误,建议采用小写来编写代码
以下情况下推荐使用大写形式:
1) 构造函数的首字母建议大写
2) 如果标识符由多个单词组成,可以考虑使用骆驼命名法——除首个单词外,后面单词的首字母大写
直接量
字面量(Literal)也叫直接量,就是具体的值,即能够直接参与运算或显示的值,如字符串、数值、布尔值、正则表达式、对象直接量、数组直接量、函数直接量等。
//空字符串直接量
1 //数值直接量
true //布尔值直接量
/a/g //正则表达式直接量
null //特殊值直接量
{} //空对象直接量
[] //空数组直接量
function(){} //空函数直接量,也就是函数表达式
JS(单行 or 多行)注释
1、单行注释以双斜杠
//
开头,//
之后的所有内容都会看作是注释的内容,对//
之前的内容则不会产生影响2、多行注释以
/*
开头,并以*/
结尾,出现在/*
和*/
之间的所有内容都会看作是注释的内容