概念
JavaScript是一门客户端脚本语言
运行在客户端游览器中,每个浏览器中都有JavaScript的解析引擎.
脚本语言:不需要编译,直接就可以被浏览器解析
可以用来增强用户与html页面的交互过程,可以控制html元素,让页面有一些动态的效果,增强用户的体验.
JavaScript=ECMAScript(客户端脚本语言标准)+JavaScript特有东西(BOM+DOM)
基本语法
- 与html结合方式
内部JS:定义< script >标签,标签体内容就是js代码
<script>
alert("Hello World");
</script>
外部JS:定义< script >标签,通过src属性引入外部的js文件
//a.js
alert("我是外部的JS");
<script src="a.js"></script>
注意:< script >可以定义在html页面的任何地方.但是定义的位置会影响执行顺序.
< script >可以定义多个
2.注释
单行注释//
多行注释/* */
3.数据类型
原始数据类型,即Java中基本数据类型
| 数据类型 | 说明 |
|---|---|
| number | 数字(整数,小数,NAN) |
| string | 字符串"abc"或’a’ |
| boolean | true false |
| null | 一个对象为空的占位符 |
| undefined | 如果一个变量没有初始化值,那么被默认赋值为undefined |
应用数据类型:对象
注意在JavaScript中.如果运算数不是运算符所要求的类型,那么JavaScript引擎会自动的将运算数进行类型转换
其他类型转number
string-number 按照字面值转换,如果字面值不是数字,则转为NAN
1.boolean-number true-1 false-0
2.其他类型转boolean
其他类型转boolean
1.number-boolean:0或NAN为假,其他为真
2.string:除了空字符串(" "),其他都是true
3.null&undefined:都是false
4.对象:所有对象都为true
//定义number类型
var num=1;
var num1=1.2;
var num2=NAN;
//输出到页面上
document.write(num+"<br>")
document.write(num1+"<br>")
document.write(num2+"<br>")
//定义String类型
var str="abc";
var str="edf";
//定义Boolean
var flag=true
//定义null,undefined
var obj=null;
var obj=undefined;
var obj3;
4.变量
变量:一小块存储数据的内存空间
Java是强类型语言,而JavaScript是弱类型语言
强类型在开辟变量存储空间时,定义了空间未来存储的数据的数据类型,智能存储固定类型的数据.
弱类型在开辟变量存储空间时,不定义空间将来的存储数据类型,可以存储任意类型的数据.
PS:通过typeof() 判断变量类型 注意 null–object(bug,认为null是空占位符)
<script>
var a=3;
alert(a);
a="a"
alert(a);
</script>
5.运算符
一元运算符
++,–,+(正号)
算术运算符
+=,=,+,-
比较运算符
<,>,===(全等于), ==
比较方式:
1.类型相同直接比较;字符串按字典顺序(逐位)比较
2.类型不同先进行类型转换,再比较
全等于-在比较之前,先判断类型,如果类型不同,则直接返回false
<script>
document.write(("123"==123)+"<br>");
document.write("123"===123+"<br>");
</script>
输出1:true 输出2:fasle
逻辑运算符
&&,||,!
三元运算符
? :
6.流程控制语句
if...else.
switch在JS中,switch可以接受任意数据类型
while
do...while
for
7.JS特殊语法
语句以;结尾,如果一行只有一条语句,则;可以省略
<script>
var a=3
</script>
变量的定义可以使用var,也可以不使用
<script>
function fun(){
var b=4//无为全局变量,有为局部变量
}
alter(b);
fun();//无对话框
function fun(){
b=4//有为全局变量,无为局部变量
}
alter(b);
fun();//有对话框
</script>
基本对象
Function
特点:形参类型不用写,返回值类型也不写;
方法是一个对象,名称相同的方法会覆盖
在JS中,方法的调用只与方法的名称有关,和参数列表无关
在方法声明中有一个隐藏的内置对象(数组),arguments,封装所有的实际参数
属性:length(参数个数)
//1.创建方式
//var fun=new function(形式参数,方法体);
var fun1=new Function("a","b","alert(a);");
/* function 方法名称(形式参数列表){
方法体
}
*/
//形参的类型不用写
function fun2(a,b){
alter(a+b);
}
/* var 方法名=function(形式参数列表){
方法体
}
*/
var fun3=function(a,b){
alter(a+b);
}
//5.调用
fun2(3,4);
练习:求任意个数的数之和
function add(){
var sum=0;
for(var i=0;i<arguments.length;i++){
sum+=arguments[i];
}
return sum;
}
var sum=add(1,2,3);
alter(sum);
Array
特点:JS中,数组元素的类型可变,数组长度可变(类似ArrayList).
属性:length长度
var arr1=new Array(1,2,3);
var arr2=new Array(5);
var arr3=[1,2,3,4,5];
var arr4=new Array();
//方法:join(参数),将数组中的元素按照指定的分隔符拼接为字符串
document.write(arr1.join("--")+"<br>");
//push()向数组的末尾添加一个或更多元素,并返回新的长度
arr1.push(11);
Boolean
Date
var date=new Date();
//返回当前date对象对应的时间本地字符串格式
document.write(date.toLocaleString()+"<br>")
//返回当前日期对象描述的时间到1970年1月1日零点的毫秒值差
document.write(date.getTime()+"<br>")
Math
Math对象不用创建,直接调用
//3.1415926....
document.write(Math.PI+"<br>");
//0-1随机数,包含0,不包含1
document.write(Math.random()+"<br>");
//3 临近整数
document.write(Math.round(3.14)+"<br>");
//4
document.write(Math.ceil(3.14)+"<br>");
//3
document.write(Math.floor(3.14)+"<br>");
//1-100随机数
var number=Math.floor((Math.random()*100))+1;
document.write(number);
Number
String
RegExp
用于表单校验
正则表达式定义字符串的组成规则.
单个字符 [ ][a] [ab] a或b [a-zA-Z0-9_]
\d单个数字字符[0-9]
\w单个单词字符[a-zA-Z0-9_]
量词符号
? 表示出现0次或1次
*表示出现0次或多次
+出现1次或多次
{m,n}表示 m<=数量<=n
{,n}最多n次
{m,}最少m次
^开始
$结束
var reg=new RegExp(^"\\w{6,12}"$);
//注意:字符串中\w为转义字符,\\w为单个字符
var reg2=/w{6,12}/;
alter(reg);
alter(reg2);
//验证指定的字符串是否符合正则规范
var flag=reg2.test(username);
Global全局对象,这个Global中封装的方法不需要对象就可以直接调用. 方法名();
var str="Mark学Java 之JavaScript";
var encode=encodeURI(str);
document.write(encode+"<br>");
var s=decodeURI(encode);
//编码字节更多
var str="Mark学Java 之JavaScript";
var encode=encodeURIComponent(str);
document.write(encode+"<br>");
var s=decodeURIComponent(encode);
//parseInt() 先判断一个字符是否是数字,直到不是数字为止,将前边数字部分转为number "s1"--NAN
var str="123abc"
var number=parseInt(str);
//判断是否为NAN,NAN和任何对象比较都为false
isNAN(str);
//将JS字符串转换为JS代码
var jscode="alert(123)"
eval(jscode);
练习:九九乘法表
<title>乘法表</title>
<style>
td{
border: 1px solid ;
}
</style>
<script>
document.write("<table align='center'>")
for (var i=1;i<9;i++){
document.write("<tr>")
for (var j=1;j<=i;j++){
document.write("<td>");
document.write(i+"*"+j+"="+(i*j)+" ");
document.write("</td>");
}
document.write("</tr>");
}
document.write("</table>")
</script>
