JavaScript
Javascript代码在浏览器中运行，做出更流畅、优美的页面效果，增强用户体验。与java是完全不同的东西，只是名称类似而已。写在<script></script>标签中
1.简介
head
部分：用于声明变量、函数、类型，为事件绑定处理函数
body
部分：调用脚本执行
外部脚本：用于定义函数、类型
•
将代码封装到一个扩展名为
js
的文件中，然后在需要的地方引用，完成一次定义，多处引用的效果，简化了代码的维护，在文件中不需要写<script></script>
标签。
特点：大小写敏感
弱类型语言
分号结尾
注释（单行，多行）
字符串推荐使用单引号，也可以使用双引号
2.Date对象
用于处理日期和时间
创建对象：
var
date=new Date();
看文档
JavaScript Date
对象参考手册
方法
toLocaleTimeString
()
表示根据本地时间格式，把
Date
对象的时间部分转换为字符串
方法
toLocaleDateString
()
表示根据本地时间格式，把
Date
对象的日期部分转换为字符串。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>03显示时间</title>
</head>
<body>
<script>
//创建时间对象
//var date = new Date();
获取世界时间，会提示当前时区
//alert(date.toString());
//代码分离：一般不会将html于js混合写
//定义函数，用于获取时间对象并显示当前时间
function showTime() {
var date = new Date();
alert(date.toLocaleString());
return false;//可以让a的跳转不执行
}
</script>
<input type="button" value="显示时间" onclick="showTime();"/>
<hr/>
点击超链接，执行js脚本，而不执行url跳转
<br/>
方式一：让js函数返回false，在onclick中也返回false
<a href="http://www.baidu.com" onclick="return showTime();">显示当前时间</a>
<br/>
方式二：将href指定成一段脚本
<a href="javascript:showTime();">点击显示时间</a>
</body>
</html>
3.数据类型
boolean
布尔
number
数字
string
字符串
Undefined
未定义
Null
空对象
Object
对象类型
Undefined
类型、
Null
类型都是只有一个值的数据类型，值分别为
undefined
与
null
查看变量的类型
typeof
变量名或
typeof
(
变量名
)
，返回变量类型的字符串
类型转换：类型名
(
变量名
)
或
parse***()
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>04类型</title>
</head>
<body>
<script>
//当变量被声明之后，没有初始化，则值为undefined
var a1;
//alert(a1);
//输出类型
//alert(typeof (a1));//返回a1变量的类型对应的字符串
//指定null值时，当前变量为nul
a1 = null;
//alert(a1);
//alert(typeof (a1));//null是一个obejct的值
//class Person { }
var a2 = '100';
alert(a2 + 1);//字符串拼接
alert(parseInt(a2) + 1);
</script>
</body>
</html>4.判断
双等号
==
判断值是否相等
三等号
===
先判断类型是否相同，再判断值是否相等
undefined==null
结果为什么？
undefined===null
结果为什么？
思考：如何判断变量是否可用？
答：先判断类型是否为
undefined,
再判断值是否为
null
，否则可用
提示：
typeof
(n)!='undefined‘
非数字判断：
isNaN
()
eval
()
用于将一段字符串转换成
js
代码执行
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>05判等</title>
</head>
<body>
<script>
//var a1;
//var a2 = null;
//undefined表示没有,null表示没有
//if (a1 == a2) {
// alert('ok');
//} else {
// alert("no");
//}
//三个等号先判断类型是否相等，在判断值是否相等
//if (a1 === a2) {
// alert('ok');
//} else {
// alert('no');
//}
var b1 = 123, b2 = '123';;
//值都为123所以相等
//if (b1 == b2) {
// alert('ok');
//} else {
// alert('no');
//}
//b1是number类型，b2是字符串类型，不相等
//if (b1 === b2) {
// alert('ok');
//} else {
// alert('no');
//}
//null与‘null’是不同的
//var temp = null;
//if (temp == 'null') {
// alert('ok');
//} else {
// alert('no');
//}
//判段变量是否可用
//判断是否为undefined:typeof(temp) == 'undefined'
//判断是否为null:temp === null
//var temp = null;
//if (typeof (temp) == 'undefined' || temp === null) {//'null','object'
// alert('no');
//} else {
// alert('ok');
//}
//var date = new Date();
//alert(typeof (date));
//alert(typeof (Date));//function
//alert(typeof (Date()));//调用Date()方法返回当前时间的字符串，类型为string
//判断是否不是一个数字
//var temp2 = 'abc';
//alert(isNaN(temp2));
//将一段字符串当作js代码
//当从文本框中获取值时，得到的是字符串，如果希望是那段字符串当作js执行，则使用eval()方法
eval('alert("abc")');
</script>
</body>
</html>5.定义方法
语法：
function
方法名
(
参数列表
){…}
方法名首字母小写
如果需要返回值，则在方法体中使用
return
关键字
调用：方法名
(
参数
)
如果有返回值，可以直接使用，如果没有返回值却使用，则值为
undefined
没有方法重载，后定义的方法会将先定义的方法覆盖
可以使用关键字
arguments
获取所有的参数，是一个数组
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>07定义方法</title>
</head>
<body>
<script>
//修饰符 返回值类型 方法名（参数列表）{。。。。。。}
//function 方法名(参数列表) { ...}
function add(a, b) {
//alert(a + b);
return a + b;//使用return返回值
}
//快捷键func,tab
function add2(a, b, c) {
//alert(a + b + c);
return a + b + c;
}
//调用方法
//var sum = add(1, 2);//直接使用变量接收方法的返回值
//alert(sum);
//接收没有返回值的方法
var sum2 = add2(1, 2, 3);
alert(sum2);
</script>
</body>
</html><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>08方法重载</title>
</head>
<body>
<script>
//不存在方法重载
//声明后的函数会将先声明的函数覆盖
function add(a, b) {
alert(a + b);
}
//function add(a, b, c) {
// alert(a + b + c);
//}
//add(1, 2);
//可变参数
function sum(a) {
//使用argumens获取所有参数，是一个数组
alert(arguments.length);//返回数组元素的个数
var sum1 = 0;
for (var i = 0; i < arguments.length; i++) {
sum1 += arguments[i];
}
alert(sum1);
}
//调用
sum(1, 2, 3, 4, 5, 6);
</script>
</body>
</html>6.匿名函数
不需要定义方法名，直接写参数列表与方法体
方式一：
function (
参数
){...return ...};
•
可以将方法赋值给一个变量，这个变量表示一个方法
方式二：
(function(n1,n2){...})(1,2);
•
定义的同时完成调用
方式三：
new Function("n1","n2","return n1+n2");
•
赋值给一个变量完成调用
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>09匿名函数</title>
</head>
<body>
<input type="button" id="btnShow" value="显示"/>
<script>
//快捷键：fun,tab
//定义匿名函数，赋值给一个变量
var f1 = function (a, b) {
// alert(a + b);
};
//通过变量调用
f1(1, 2);
//典型应用：为事件绑定处理函数，传递回调函数
//根据id获取页面元素，为它绑定单击事件
document.getElementById('btnShow').onclick = function () {
alert(123);
};
</script>
</body>
</html>7.类
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>11类</title>
</head>
<body>
<script>
//为类增加成员
//function Person(name) {
// this.Name = name;
// this.Say = function () {
// alert(this.Name);
// };
// // return name; //类是没有返回值的，所以此行可不写
//}
//使用构造方法创建对象
//var p1 = new Person('aaa');
// p1.Say();//调用 方法
//alert(typeof (p1));//object
//alert(typeof (Person('aaa')));
//alert(typeof (Person));//Person就是一个函数，类型是function
function Person() {
}
//为对象增加成员
var p1 = new Person();
p1.Name = "aaa";//为对象p1新建了一个属性Name
p1.say = function () {
alert(p1.Name);
};
p1.say();
//新建出来的对象，是没有Name属性的，因为Person类中没有Name属性
var p2 = new Person();
alert(p2.Name);
</script>
</body>
</html>
266
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
