javascript简介
JavaScript 简介
JavaScript
是互联网上最受欢迎的编程语言之一,用于为网页添加交互性,处理数据,以及创建各种应用程序(移动应用程序,桌面应用程序,游戏等), 这门语言可用于HTML
和 web
,更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机
等设备。
JavaScript 基本特点
JavaScript
是一种轻量级
的编程语言。JavaScript
是一种解释性
脚本语言(代码不进行预编译)JavaScript
是可插入 HTML 页面的编程代码。JavaScript
插入 HTML 页面后,可由所有的现代浏览器执行。- `JavaScript 很容易学习。
JavaScript组成部分
1。ECMAScript,描述了该语言的语法和基本对象。
2。文档对象模型(DOM),描述处理网页内容的方法和接口。
3。浏览器对象模型(BOM),描述与浏览器进行交互的方法和接口。
javascript可以做什么?
应用场景
浏览器:大部分公司的前端都在使用javascript来完成浏览器客户端的开发。
服务端:有些有大前端团队的公司开始使用nodejs做web服务端开发。
其他:JavaScript还可以运用在APP、微信小程序、桌面应用、浏览器插件开发、游戏开发、VR、AR、硬件、操作系统等领域。
第一个JavaScript程序
JavaScript 用法
在HTML中,必须在<script>
和</script>
标签之间插入JavaScript代码
<script> 标签
如需在 HTML 页面中插入 JavaScript,请使用<script>
标签。
<script>
alert("我的第一个 JavaScript");
</script>
您无需理解上面的代码。只需明白,浏览器会解释并执行位于 <script> 和 </script>之间的 JavaScript 代码
那些老旧的实例可能会在 <script> 标签中使用 type="text/javascript"。现在已经不必这样做了。
JavaScript 是所有现代浏览器以及 HTML5 中的默认脚本语言。
JavaScript可被放置在 HTML 页面的 <body> 和 <head> 部分中。在下面的示例中,我们将其放在 <body> 标签中。
<html>
<head>
</head>
<body>
<script>
alert("我的第一个 JavaScript");
</script>
</body>
</html>
JavaScript 输出
JavaScript 没有任何打印或者输出的函数。
不过 JavaScript 可以通过不同的方式来输出数据:
- 使用 document.write() 方法将内容写到 HTML 文档中。
- 使用 window.alert() 弹出警告框。
- 使用 innerHTML 写入到 HTML 元素。
- 使用 console.log() 写入到浏览器的控制台。
document.write()
将一个字符串写入到HTML文档。此功能可用于写入文本和HTML。
让我们使用JavaScript在浏览器中打印 "Hello W3Cschool!"。
<html>
<head> </head>
<body>
<script>
document.write("Hello W3Cschool!");
</script>
</body>
</html>
格式化文本 (Formatting Text)
我们可以使用HTML标签来格式化JavaScript中的文本。
例如,我们可以输出文本为标题。
<html>
<head> </head>
<body>
<script>
document.write("<h1>Hello W3Cschool!</h1>");
</script>
</body>
</html>
运行结果:
在网页中添加JavaScript
JavaScript添加到<head>
您可以在HTML文档中放置任意数量的脚本。 通常,脚本标签放置在HTML文档的头部 如下:
<html>
<head>
<script>
</script>
</head>
<body>
</body>
</html>
一般script标签会被放在头部或尾部。头部就是<head>里面,尾部一般指<body>里
JavaScript添加到<body>
也可以在<body> 标签中包含Javascript代码 如下:
<html>
<head> </head>
<body>
<script>
</script>
</body>
</html>
注意: 为了使HTML显示不会被脚本加载阻止,可将脚本放在<body>元素的底部改善页面加载。
<script> 标签
<script>标签可以使用两种属性,language 和 type,它们指定脚本的类型:
<script language="javascript" type="text/javascript">
</script>
注意: language 属性已弃用,不推荐使用。 type 也可以忽略不写
在下面的示例中,我们使用 alert() 函数在脚本标签内创建了一个警告框。
<html>
<head>
<title></title>
<script>
alert("这是一个alert警告框!");
</script>
</head>
<body>
</body>
</html>
运行结果:
外部JavaScript
JavaScript脚本也可以放在外部文件中。
在多个不同网页中使用相同的代码时,外部脚本是很实用的。
JavaScript 文件的文件后缀是 .js
下面我们创建了一个新的文本文件,并将其称为 demo.js
外部JavaScript
要使用外部脚本,请将脚本文件的名称放在<script>
标签的 src(source)属性中
例子:
<html>
<head>
<title> </title>
<script src="demo.js"></script>
</head>
<body>
</body>
</html>
在 demo.js 文件中新增如下代码:
alert("这是demo.js文件的警告框");
外部脚本不能使用<script>标签包裹。
外部JavaScript
打开HTML文件,将弹出 "这是demo.js文件的警告框"
您可以在 <head>
或 <body>
中放置外部脚本引用。
无论您选择哪种,外部脚本引用的效果,与在<script>
标签中直接写入代码一致。
将JavaScript放在外部文件中具有以下优点:
- 分离HTML和代码。
- 使HTML和JavaScript更容易阅读和维护。
- 缓存的JavaScript文件可以加快页面加载速度。
JavaScript 单行注释
JavaScript 注释可用于提高代码的可读性。
JavaScript 不会执行注释。
我们可以添加注释来对 JavaScript 进行解释,或者提高代码的可读性。
单行注释以 //
开头。
本例用单行注释来解释代码:
// 输出标题:
document.getElementById("myH1").innerHTML="欢迎来到我的主页";
// 输出段落:
document.getElementById("myP").innerHTML="这是我的第一个段落。";
JavaScript 多行注释
多行注释以 /* 开始,以 */ 结尾。
下面的例子使用多行注释来解释代码:
/*
下面的这些代码会输出
一个标题和一个段落
并将代表主页的开始
*/
document.getElementById("myH1").innerHTML="欢迎来到我的主页";
document.getElementById("myP").innerHTML="这是我的第一个段落。";
javascript的基本概念
语句
JavaScript 程序的执行单位为行(line),也就是一行一行地执行。一般情况下,每一行就是一个语句。
语句(statement)是为了完成某种任务而进行的操作,比如下面就是一行赋值语句。
var a = 1 + 3;
这条语句先用var
命令,声明了变量a
,然后将1 + 3
的运算结果赋值给变量a。
1 + 3
叫做表达式(expression),指一个为了得到返回值的计算式。语句和表达式的区别在于,前者主要为了进行某种操作,一般情况下不需要返回值;后者则是为了得到返回值,一定会返回一个值。凡是 JavaScript 语言中预期为值的地方,都可以使用表达式。比如,赋值语句的等号右边,预期是一个值,因此可以放置各种表达式。
语句以分号结尾,一个分号就表示一个语句结束。多个语句可以写在一行内。
var a = 1 + 3 ; var b = 'abc';
分号前面可以没有任何内容,JavaScript 引擎将其视为空语句。
;;;
上面的代码就表示3个空语句。
表达式不需要分号结尾。一旦在表达式后面添加分号,则 JavaScript 引擎就将表达式视为语句,这样会产生一些没有任何意义的语句。
1 + 3;'abc';
上面两行语句只是单纯地产生一个值,并没有任何实际的意义。
JavaScript 变量
变量是用于存储信息的"容器"
,变量的值可以在整个程序中被修改。
变量声明
使用一个变量之前应先声明, 变量是使用关键字 var
来声明的。
var x;
上面的例子中,声明了变量 x
。
如果没有在 var
声明语句中给 x
指定初始值, 在 x
存入一个值之前, x
的初始值为 undefined
。
注意: JavaScript区分大小写。例如,变量 lastName 和 lastname 是两个不同的变量。
JavaScript 使用 var 声明变量, 在支持ES6语法的JavaScript环境中还可以使用 let 声明变量.
“赋值”运算符
在JavaScript中,等号 =
称为“赋值”运算符,而不是“等于”运算符。
例如,x = y
表示将 y
的值赋给 x
。
var x = 3;
var y = 4;
x = y;
// 这时 x 的值为4
如上所示, 我们还可以