第一、Javascript核心基础语法-CSDN博客

第一章 Javascript核心基础语法

一、为什么要使用JavaScript ：

1. 服务器端动态网页最大缺陷：每次请求都要到服务器进行，加重服务器的负担；

2. 提高用户体验度，增加交互性。

二、 JavaScript和 JAVA 的区别：

1. JAVA从编码到运行经过：编译、类装载、字节码校验、解释器 ---> 运行。即需要编译 ---> 解释 ---> 运行。

2. JavaScript是一种解释型语言，代码存在于 HTML 网页中（或者外部连接），不需要编译即可以执行。解释特点：一行一行进行解释、执行。

3. 更多区别不再赘述。

三、 JavaScript的前景： HTML5+JavaScript

四、 JavaScript技术体系：

1. JavaScript核心语言定义。数据类型、常量、变量、运算符、语句等。

2. 原生对象和内置对象。

3. BOM（浏览器对象模型）

4. DOM（文档对象模型）

5. 事件模型

五、 JavaScript添加到 XHTML 文档中

1. 内嵌式：

1) <script type="text/javascript">JS代码 </script>

2) <noscript>当禁用了 JS 时，这行文字显示在页面上 </noscript>

3) 脚本隐藏：<script type="text/javascript"></script> ，当前浏览器如果不支持脚本，运行到 HTML 注释时进行跳过不显示信息；当浏览器支持 JS 脚本，运行到 script 标签将 HTML 解释器转换为 JS 解释器，忽略 HTML 注释，并运行脚本。

2. 外部链接<script type="text/javascript" src=""></script> 。当 type 限制了脚本类型，外联脚本扩展名无所谓。

3. 脚本放在事件属性中：<input type="button" οnclick="alert('test')" value=" 点我 " />

4. 伪URL 方式： <a href="javascript:alert('test2')"> 点我 </a>

六、 JavaScript变量、常量

1. JavaScript是弱类型语言，定义变量时无需明确数据类型声明，而且变量并不一定要初始化。

2. 变量（空间现分配）。 var a;a=5(Number 类型 );a="string"(string 类型 )

3. 常量： const a=5; 这里如果没有初始化，类型就为 undefined

七、 JavaScript数据类型

（一）原始数据类型 5 种：

1. Undefined类型：

没有被赋过值即未定义类型（没有分配空间）

如：a---> XX 当 a 为 undefined 时，空间没有分配

2. Null类型

空间已分配，但对象为空（引用数据类型）

如：a--> null 已分配，对象为空。

请看下列代码：

var num=null;

alert(typeof num);

返回object 类型 null 被认为是对象的占位符

3. Boolean

特别现象：(Chrome JavaScript 控制台 )

再看看其他情况：

""==false;

evaluating...

true

0==false;

evaluating...

true

总结（数据类型自动进行了转换）：直接用== 判断 null/undefined 时，永远返回 false ，据说是设计 JavaScript 时规定的。。。

在if 条件中使用：

①　至少有一个字符的字符串、非0 数字或对象，返回 true

②　空字符串、0 、 null 、 undefined 返回 false 。

4. Number类型

①　可以表示32 为的整数，也可以表示 64 位的浮点数。

②　 Number类型的外边界及无穷（无穷不能参与计算）：

Number.MAX_VALUE*100;

evaluating...

Infinity

③　特殊值：NaN （ not a number ）函数： isNaN()

NaN不能用于算术计算，而且与自身不相等

NaN==NaN;

evaluating...

false

0/0;

evaluating...

NaN

1.0/0;

evaluating...

Infinity

4/0;

evaluating...

Infinity

isNaN("dddss22");

evaluating...

true

isNaN("122");

evaluating...

false

而JAVA 中，当任何实型除以 0 ，都会抛出数学异常，浮点数除外： 1.0/0 -->Infinity

5. String类型

JavaScript没有字符类型，所以声明字符串可以用双引号或者单引号

6. 数据类型转换

①　自动转换：

"2"+1;

evaluating...

"2"-1;

evaluating...

②　转换数字的方法：parseInt() parseFloat() 只能对 string 类型转换，其他类型返回 NaN

parseInt("2dd");

evaluating...

parseInt("d2dd");

evaluating...

NaN

parseInt(true);

evaluating...

NaN

parseInt("1.5dd")

evaluating...

parseFloat("1.5dd")

evaluating...

1.5

练习：

a. Select标签中用 JavaScript 写出 1900--2000 的 option

	<script type="text/javascript">
        	for(i=2000;i>=1900;i--){
document.write("<option value='"+i+"'>"+i+"</option>");
}
        </script>

b. JavaScript写出九九乘法表

两个FOR循环

<table border="1">
	<tr>
  <script type="text/javascript">
        	for(i=1;i<=9;i++){
				for(j=1;j<=9;j++){
					document.write("<td>"+j+"*"+i+"="+j*i+"</td>");
					if(j==i){
						for(k=0;k<9-j;k++){
							document.write("<td></td>");
						}
						document.write("</tr>");
						break;
					}
				}
			}
  </script>
</table>

一个FOR循环

<table border="1">
	<tr>
  <script type="text/javascript">
        	for(i=1,j=1;i<=9;j++){
					document.write("<td>"+j+"*"+i+"="+j*i+"</td>");
					if(j==i){
						j=0;
						i++;
						document.write("</tr>");
					}
			}
  </script>
</table>

（二）引用数据类型 - 对象

1. 对象分为：预定义对象和自定义对象；

预定义对象：

①　原生对象：如Object,Function,Array 等等

②　内置对象：Global Math

③　宿主对象：DOM BOM

2. 概述：

①　 Object： JS 中所有对象的基“类”。属性： constructor 、 prototype

②　原始类型包装器：Boolean 、 Number 、 String 。

String.length 属性（ JAVA 中 String 的 length() 是方法）

String.slice() <==>JAVA String.subString();

下面这句代码进行了类型转换：

num = "ABCD";
alert(num.slice(1,3));

③　 Array:

1) 数组的初始化：arr=new Array();arr=new Array(5);arr=[1,"abcd",true];

2) 特点：

a. 自增长

b. 每个数组元素类型可以不同，因为JS 是弱类型语言，每个元素可以是任意的数据类型

c. 当数组某几个元素没有初始化，返回undefined 。如：

arr = new Array();arr[0]=true;arr[7] = 2;alert(arr[5]); ==>返回 undefined

④　 Date:getHours();getMinutes();getSeconds();

需要注意的是：month 默认从 0 开始，即现实中的 5 月份， getMonth() 返回 4

⑤　 Global:需要记忆的方法有： parseInt parseFloat eval 等等

Eval：调用解释器解释、执行参数内的字符串；其重要性相对于： JAVA 中的反射。

事例：业务需要从服务器端传递一个数组到客户端：{1,2,3,4,5};

首先在服务器中将数组写为一个字符串："[1,2,3,4,5]" 并传递到前台

在JS 中我们获取到这个字符串可以如下构造这个数组：

eval("var arr=[1,2,3,4,5]");alert(arr);

⑥　函数

a. 关键字function + 函数名 + 形参列表 + 方法体

b. 因为JS 是弱类型语言，所以函数定义返回类型没有必要。

c. 几个特别的例子：

1. 调用有参数列表的函数，但是没有传递参数，返回undefined ，因为形参没有初始化， undefined 计算还是 undefined

function a(b,c){return b+c;} alert(a());

2. 调用无参数列表的函数，但是传递了参数；函数有隐式的arguments 数组获取参数

function a(){return arguments[0]+arguments[1];} alert(a(1,2));

function a(){return arguments[0]+arguments[1];} 
var result=a; //复制指向这个方法体的指针
alert(result);//返回：function a(){return arguments[0]+arguments[1];} 
alert(result(1,9));

4. 匿名函数： var a=function(){};