ECMAScript学习
基础语法:
- 如何与HTML结合。
方式1:直接在script标签里面写js的代码,script标签可以定义在任何位置,但是会影响执行它的顺序。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <!-- 在HTML页面的script标签内直接写js --> <script> alert("Hello CSDN!") </script> </head> <body> </body> </html>
alert()可以在浏览器打开的时候弹出一个窗口提示信息括号里面写希望提示的信息,它是堵塞式的,在你没有点击确定按钮之前,网页的后继内容将不会被加载。
下面是用谷歌浏览器运行的结果:
方式二:利用script标签的src属性外部引入js文件
<!-- 从外部文件引入js-->
<script src="demo.js"></script>
运行结果:
- ECMAScript中如何给代码注释?
与C语言类似:
\\注释的内容:可以进行单行注释
/* 注释的内容*/:可以进行多行注释
- 有哪些数据类型?
- 原始数据类型(基本数据类型):有number、string、boolean、null、undefined五种。
number:表示数字类型,整数、小数、NaN(not a number 一个不是数字的数字类型)。
string:字符串,表示字符串,如“abc”,"a",'abcd'无论是单引号还是双引号包裹都是字符串,没有字符的概念。
boolean:true 和 false。
undefined:未定义,如果一个变量没有给初始化值,则会被默认赋值为undefined。
null:一个对象为空的占位符。
- 引用数据类型:对象
- 变量的认识和学习。
变量:实际上是一块存储数据的内存空间。
JavaScript是一门强类型的语言,强类型语言:在开辟变量的存储空间时,定义了空间将来存储的数据类型,只能存储定义时的类型的数据,不能存储其他类型的数据。而弱类型的编程语言则在开辟变量的存储空间时,不用定义空间将来存储的数据类型,可以存放任意类型的数据。
定义语法: var 变量名 = 初始值;
<script>
var a = "watermelon!!";
alert(a);
a = 123456;
alert(a);
//定义number类型变量
var num1 = 1;
var num2 = 1.5;
var num3 = NaN;
//输出到body
document.write(num1 + "<br>");
document.write(num2 + "<br>");
document.write(num3 + "<br>");
//定义string类型变量
var str = "abc";
var str2 = "edm ed ed m";
document.write(str + "<br>"+ str2+ "<br>");
//定义Boolean类型
var flag = true;
document.write(flag+ "<br>")
//定义null、undefined类型
var obj1 = null;
var obj2 = undefined;
var obj3;
document.write(obj1 + "<br>");
document.write(obj2 + "<br>");
document.write(obj3 + "<br>");
</script>
运行结果:
//用typeof运算符,测出变量的具体类型
document.write(typeof (num1) +"------" + typeof(num2) +"------" + typeof(num3));
document.write(typeof (str1 )+ "-----" + typeof(str2) + "----" + "<br>");
document.write(typeof (flag) + "<br>");
document.write(typeof (obj1) + "-----" + typeof (obj2)+ "----" + typeof(obj3) + "<br>");
输出结果:
- 运算符的认识和学习(与Java和C/C++类似不再详细记录)
- 一元运算符: 只有一个运算数的运算符,++,-- ,+。
- 算数运算符:+ - * / %....
- 赋值运算符:= ,+=, -=...
- 比较运算符:> < >= <= != == ===(全等于) ; 如果比较的类型不同则先进行类型转换。
- 逻辑运算符: && || ! (与或非)
- 三元运算符:?:(表达式)
- 流程控制语句的认识和学习
- if...else选择语句
<script>
var a = 10;
if (a >10){
document.write("这是一个比10大的数!");
}else if (a < 10){
document.write("这是一个比10小的数!");
}else{
document.write("这个数是10!")
}
</script>
运行结果:
- switch选择语句 在java中switch语句可以接受的数据类型byte int short char 枚举 string,而在js中switch语句可以接受任意的原始 数据类型
var val = undefined;
switch (val) {
case "abc":
document.write("abc");
break;
case 123:
document.write(123);
break;
case null:
document.write(null);
break;
case "key":
document.write("key");
break;
case undefined:
document.write(undefined);
break;
default:
document.write("another!");
break;
}
运行结果:
- while循环
<script>
var b = 6;
while(b > 0){
document.write(b + " ");
b--;
}
</script>
运行结果:
- do...while循环(与while类似)
- for 循环
<script>
var count = 66;
for (var c = 0; c < count; c++){
document.write(c + "号数字!" + "<br>")
}
</script>
运行结果
- 特殊语法
1.语句以分号;结尾,如果一行只有一条语句则分号可以省略。(不建议)
2.变量的定义使用var关键字,也可以不使用。直接 变量名 = 值;的方式声明变量,区别:如果使用var关键字定义变量,则改变量是局部变量,不用var关键字定义的变量是全局变量。(也不建议)
练习
要求用今天所学的JavaScript知识完成一个99乘法表。
<script>
for (var a = 1; a <10;a++){//控制行数
for (var b = 9;b > 9-a; b--){//控制列数
document.write("<button>" + a + "*" + (10-b) + "=" + a * (10-b)+" </button>");
}
document.write("<br>");
}
</script>
运行结果:
ECMAScript的基础语法学习到此结束!