JavaScript从入门到精通学习笔记（一）

最新推荐文章于 2024-08-18 18:06:37 发布

Terisadeng

最新推荐文章于 2024-08-18 18:06:37 发布

阅读量1.4w

点赞数 42

分类专栏： JavaScript 文章标签： JavaScript

本文链接：https://blog.csdn.net/dongyuxu342719/article/details/79201527

版权

最近有些空闲时间觉得前端框架虽然提高了开发效率，却让人的基础变得薄弱，所以打算再去学习一下原生JS。

第二章使用JavaScript开发

2.1、编写第一个JavaScript脚本‘

开发工具：MyEclipse

新建web项目命名Chapter2，在WebRoot目录下新建myfirstpage.htm文件，添加如下内容

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>My First Page</title>
<script type="text/javascript">
		function yetAnotherAlert(textToAlert){
		alert(textToAlert);
}
yetAnotherAlert("This is Chapter2.");
</script>
</head>
<body>
</body>
</html>

DOCTYPE元素是用来定义文档类型的，注意内容是否正确。在<head>标签中定义了一段js脚本，作用是在加载页面时弹出一个警告框。

修改web.xml，在<welcome-file-list>标签的第一行添加<welcome-file>myfirstpage.htm</welcome-file>，这样在启动项目时默认的加载页面就是myfirstpage.htm。

2.2、使用<script>标签的src属性引入外部js脚本文件

为了便于管理以及重用js脚本，可以将脚本定义在单独的文件中，然后在使用时通过<script>标签的src属性引入外部js脚本文件。定义WebRoot/webresources/js目录，然后在其中新建一个myscript.js文件。文件内容为：

function yetAnotherAlert(textToAlert){
	alert(textToAlert);
}
yetAnotherAlert("This is Second Example.");

然后修改myfirstpage.htm文件中的<script>标签的内容如下：

<script type="text/javascript" src="webresources/js/myscript.js"></script>

其中的src属性的值就是定义的myscript.js文件的文件路径，项目的根目录是WebRoot及Chapter2，所以这里的路径就相当于http://localhost:8080/Chapter2/webresources/js/myscript.js，注意这里使用的是相对路径，如果是“/”开始，就不能定义为"/webresources/js/myscript.js"，因为斜杠开头的路径是绝对路径，需要定义为src=” /Chapter2/webresources/js/myscript.js”才能正确解析。

注：如果是用记事本编写html文件，那么在保存时记事本可能会默认为文档添加一个.txt的扩展名，这时可以用引号把文件名引用起来—例如，”myfirstpage.htm”。如果不加引号，记事本会添加.txt扩展名将文件保存为”myfirstpage.htm.txt”。

第三章 JavaScript的语法和语句

3.1语法特点

1、区分大小写

2、忽略空白，JavaScript会忽略增加可读性的空格、缩进。这里有一些列外是一些关键字(比如return)被单独放在一行时，会被JavaScript解释器误解。

3、注释，分为单行注释（以两个正斜线开始没有结束标记，因为它只占一行）和多行注释（以”/*”开始，以”*/”结束，可以包含多行）。

4、分号，在JavaScript里，分号用来描述表达式。对于大多数语句和表达式，分号都不是必须的，然而，不使用分号可能会遇到一些莫名其妙的问题。比如，考虑下面的语句：

return

(varName);

很可能你想输入的是：

return(varName);

但JavaScript根据自己的理解，在return语句后插入了一个分号。对于JavaScript解释器，这段代码看起来就像这样：

return;

(varName);

这段代码将不会执行，在函数中它将返回undefined给调用者。因此在应该使用分号的地方最好不要省略。

5、正确放置JavaScript

JavaScript可以被放置在HTML页面中的几个位置：在<head>和</head>部分，或在<body>和</body>标签之间。不过，将<script>段放在<body>部分变得越来越常见。在声明为可扩展超文本标记语言（XHTML）的页面中使用JavaScript时，<script>标签必须在CDATA部分中声明。否则XHTML会将<script>标签解析为另一个XML标签，因此，在严格XHTML中使用的JavaScript应该做如下声明：

<script type=”text/javascript”>
	<!CDATA[
		//JavaScript goes here
	]]>
</script>

较早的浏览器可能不能正确解析CDATA部分。这个问题可以通过将CDATA的开始和结束放在JavaScript的注释内解决，就像下面这样：

<script type=”text/javascript”>
	//<!CDATA[
		//JavaScript goes here
	//]]>
</script>

如果把实际的JavaScript代码放在一个独立的文件中，那么根本不需要使用这个难看的CDATA部分。

将JavaScript放置到外部文件具有下面几个优点：

1、代码从标记分离：将JavaScript代码保存在一个单独的文件中使得HTML的维护变得更加容易，并且它还保留了HTML结构，不必在XHTML中使用CDATA部分。

2、更容易的维护：把JavaScript作为一个单独的文件，这样修改该文件时就不会触及网站的其他文件。

3、缓存：为JavaScript使用独立文件允许web浏览器缓存该文件，这样可以为用户加快网页的加载。

3.2JavaScript语句

3.2.1语句的结构包括简单语句和复合语句

简单语句如下：x = 4;

复合语句包含多层逻辑，比如下面的if/then/else判断语句：

if(something==1){
	//some code here
} else{
	//some other code here
}

3.3JavaScript的保留字

JavaScript中的保留字在程序中不能用作变量、标示符或者常量名，比如：

//Don’t do this;

var var = 4;

该代码不会对浏览器造成直接错误，但它也不会按照你的意图执行。

目前ECMA-262规范中的保留字如下：

break delete if this while case do in throw with catch else instanceof try continue finally new typeof debugger for return var default function switch void

下面这些是为将来的使用保留的，因此也不可以用于程序中：

class enum extends super const export import

下面列出的单词是为将来在严格模式下使用而保留的：

implemen