[JavaScript知识库]JavaScript概述

JavaScript

一、概述

概念：JavaScript是脚本语言，是一种解释性脚本语言，是一种轻量级的编程语言。
在HTML中的位置：在html页面中的脚本必须位于script围堵标签内，script标签放在head中可以，body中也可以，放在最后也可以，也可以放在外部文件中，如Css。对位置要求不严格。

二、基本语法

JavaScript注释与Java的单行和多行注释相同。

2.1、变量

声明变量的关键字：var
语法：var 变量名称;

变量的命名规则：

• 变量必须以字母开头
• 变量也能以$和_符号开头
• 变量名称对大小写敏感（y和Y是不同的变量）
• 不能使用关键字保留字

变量的命名规范：

• 见名知意。例如：breadPirce，userService等，避免无意义的a，b，c等。
• 推荐驼峰命名法，及第一个单词的首字母小写，以后每个单词的首字母大写。

2.2、数据类型

2.2.1、值类型

字符串String、数字Number、布尔boolean
空Null、未定义Undefined

2.2.2、引用数据类型

对象（Object）、数组（Array）、函数（Function）

2.3、运算符

算数运算符：+ - * / % 、 ++ 、 –
赋值运算符：= 、 +=、 -= 、*= 、 /= 、 %=
字符串的连接符：+
逻辑运算符： && || ！
条件运算符：？:
比较运算符： == 、！= 、 > 、<、 >= 、 <=

三、对象

3.1、Array对象

Array对象用于在变量中储存多个值，也就是数组。

<script>
	//声明数组的方式1：
	var names = new Array();
	names[0] = "1";
	names[1] = "2";
	names[2] = "3";
	for(var i= 0;i<names.length;i++){
		document.write(names[i]);
	}
	//声明数组的方式2：
	var nums = ["1","2"];
	for(var i= 0;i<nums.length;i++){
		document.write(nums[i]);
	}
	//声明数组的方式3：
	var nums = new Array("1","2");
	for(var i= 0;i<nums.length;i++){
		document.write(nums[i]);
	}
</script>

3.2、Date对象

3.2.1、创建日期对象

• var date1 = new Date();
• var date2 = new Date(milliseconds);
• var date3 = new Date(dateString);
• var date4 = new Date(year, month, day, hours, minutes, seconds, milliseconds);

3.2.2、日期对象的常用方法

3.3、Math对象

3.3.1、常用属性

<script>
	var pi = Math.PI;//返回圆周率
</script>

3.3.2、常用方法

<script>
	var num = Math.random();//返回随机数
	var max = Math.max();//返回最大值
	var min = Math.min();//返回最小值
</script>

四、函数

4、常用全局函数

4.1.1、isNaN(param)

用于检查其参数是否是非数字值。
是数值的返回false，不是数值返回true。

console.log(isNaN(666));//false 
console.log(isNaN(1+2));//false 
console.log(isNaN("hello"));//true

4.1.2、parseFloat(String)

可解析一个字符串，并返回一个浮点数。该函数指定字符串中的首个字符是否是数字。如果是，则对字符串进行解析，直到到达数字的末端为止，然后以数字返回该数字，为不是作为字符串。

console.log(parseFloat("66"));//66 
console.log(parseFloat("199.99"));//199.99 
console.log(parseFloat("1024 2048 4096"));//1024 
console.log(parseFloat(" 128 "));//128 
console.log(parseFloat("10年"));//10 
console.log(parseFloat("今天是8号"));//NaN

• 字符串中只返回第一个数字
• 开头和结尾的空格是允许的
• 如果字符串的第一个字符不能被转换为数字，那么parseFloat()会返回NaN

4.1.3、parseInt(String,radix)

注：当参数radix的值位0，或没有设置该参数时，parseInt()会根据String来判断数字的基数。

当忽略参数radix。JavaScript默认数字的基数如下：

• 如果 string 以 “0x” 开头，parseInt() 会把 string 的其余部分解析为十六进制的整数。
• 如果 string 以 0 开头，那么 ECMAScript v3 允许 parseInt() 的一个实现把其后的字符解析为八进
  制或十六进制的数字。
• 如果 string 以 1 ~ 9 的数字开头，parseInt() 将把它解析为十进制的整数

4.2、自定义函数

4.2.1、语法

function 自定义函数名称(参数列表){
	//函数体
}

//匿名函数
var fun = function(){
	document.write("hello");
}

五、自定义对象

//定义对象
var student = {name:"sda",age:18,height:178.5};
var student2 = {
		name:"sda",
		age:18,
		height:178.5,
		study:function(){
			alert("hello");
		}
};

六、Window–浏览器对象模型

6.1、window对象

所有浏览器都支持 window 对象。它表示浏览器窗口。（ 没有应用于 window 对象的公开标准，不过所有浏览器都支持该对象）。

所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员。

全局变量是 window 对象的属性。全局函数是 window 对象的方法。

Window 对象表示浏览器中打开的窗口。

6.2、window对象属性

6.2.1、history对象

window.history 对象包含浏览器的历史。

window.history对象在编写时可不使用 window 这个前缀。

常用方法：

history.back() - 与在浏览器点击后退按钮相同

history.forward() - 与在浏览器中点击向前按钮相同

history.go(1/-1)-- 参数为1：等同于 history.forward()，参数为-1，等同于history.back()

6.2.2、location对象

window.location 对象用于获得当前页面的地址 (URL)，并把浏览器重定向到新的页面。

常用属性和方法：

window.location 对象在编写时可不使用 window 这个前缀。

href 当前窗口正在浏览的网页地址

replace(url) 转向到url网页地址

reload() 重新载入当前网址，如同按下刷新按钮

6.2.3、定时器

//方法一：
var flag1 = window.setInterval("定时调用的函数",时间间隔毫秒);
//方法二：
var flag2 = window.setTimeout("定时调用的函数",时间间隔毫秒);
//注：单单只有这样不足以实现定时器，需要将flag2放入定时调用的函数中，这样就会循环调用，实现定时器的效果

七、事件

7.1、HTML事件

HTML 事件可以是浏览器行为，也可以是用户行为。

例如页面加载完成、你点击个按钮、文本框输入了文字等等，都是HTML事件的案例。

通过当事件发生时，我们希望可以做些事情，例如点击完毕按钮之后希望跳转页面、文本框输入完毕之后验证有效性等，那么这些要做的事情我们就可以通过JavaScript实现。

7.2、常用的HTML事件

八、DOM模型

8.1、document对象

当浏览器载入 HTML 文档, 它就会成为 Document 对象。

Document 对象是 HTML 文档的根节点。

Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问。

提示：Document 对象是 Window 对象的一部分，可通过 window.document 属性对其进行访问。

8.2、常用方法

8.2.1、查找HTML元素常用方法

8.2.2、修改HTML内容和属性

• 修改内容
  修改 HTML 内容的最简单的方法是使用 innerHTML 属性。
  修改 HTML 元素的内容的语法：
  document.getElementById(id).innerHTML=新的 HTML。
  PS： 绝对不要在文档(DOM)加载完成之后使用 document.write()。这会覆盖该文档。
• 修改 HTML 属性
  修改 HTML 元素属性的语法：
  方式1：document.getElementById(id).attribute=新属性值
  方式2：document.getElementById(id).setAttribute(属性名，属性值);

8.2.3、修改HTML元素的CSS

修改 HTML 元素css的语法：
document.getElementById(id).style.property=新样式

总结

JavaScript与Java有些相似，语法方面可参考Java。