javaScript授课讲义

冷不防 2022-12-27 08:19 125阅读 0赞

一、javaScript是C系语言，所以它的语法与C相同

\---------------------------------------------------------

二、javaScript的数据类型：  
（1）数值；（2）字符串类型；（3）布尔类型；（4）null类型 ；（5）undefine类型； (6)Symbol类型； （7）引用类型  
\---------------------------------------------------------  
三、如何定义javaScript的对象？  
（1）用var（不推荐）; (2)let(推荐使用) (3)const(常量）  
例1：  
<script type="text/javascript">  
var str="aaaaaa";  
//alert(str);  
//console.log(str);  
</script>  
例2：加法程序：  
<script type="text/javascript">  
let a=18;  
let b=20;  
a=a+b;  
console.log(a);  
</script>  
例3：用const定义常量，它被修改时会报错  
<script type="text/javascript">  
const a=18;  
a=19;  
console.log(a);  
</script>  
报错信息如下：  
Uncaught TypeError: Assignment to constant variable.  
at index.html:13  
\---------------------------------------------------------  
四：javaScript的控制语句，和C语言的相同  
1.判断语句：  
（1）if语句  
例：if(a>b) console.log("OK");  
(2) if...否则语句  
例：if(a>b)\{ console.log("OK") \} else\{ console.log("error")\}  
(3) 否则如果语句  
例：if()\{\}  
else if()\{\}  
else if()\{\}  
....  
else\{\}  
(4) ?号语句  
a>b?a:b;  
(5)switch(key)\{  
case 常量1:  
break;  
case 常量2:  
break;  
case 常量3:  
break;  
\}  
(6)循环语句：  
while()\{\}  
for()\{\}  
do\{\}while();  
(7)continue;  
(8)break;  
\---------------------------------------------------------  
五、数组

（1）一维数组  
A.定义  
let str=\["中国","美国","日本","泰国"\];  
B.遍历  
<script type="text/javascript">  
let str=\["中国","美国","日本","泰国"\];

//for()循环  
for(let i=0;i<str.length;i++)\{  
console.log(str\[i\]);  
\}

//forEach循环 是将str数组中的每个元素分别传给index这个参数，然后打印这个参数。  
str.forEach(function(index)\{  
console.log(index)  
\});

for(let w in str)\{  
console.log(str\[w\]);  
\}

//不能保证for ... in将以任何特定的顺序返回索引。

var a = \{1:"a",4:"d",3:"c",2:"b"\};  
for(var i in a)  
console.log(i + ": " + a\[i\])  
// 1:a 2:b 3:c 4:d  
  
//4.for.....of  
//遍历可迭代对象（包括 Array，Map，Set，String，TypedArray，arguments 对象等等）要迭代的数据（IE 浏览器不支持）  
const array1 = \['1', '2', '3'\];  
for (let i of array1) \{  
console.log(i);  
\}  
//对于for...of，for，for...in的循环，可以由break中止或跳出循环 ,arr.forEach 可以抛出异常

//forEach() 本身是不支持的 continue 与 break 语句的，  
//但是我们可以使用 return 语句实现 continue 和break关键字的效果：  
//模拟continue的情况  
let arr = \[1, 2, 3, 4, 5\];  
arr.forEach(function (item) \{  
if (item === 3) \{  
return;  
\}  
console.log(item);  
\});

var arr = \[1, 2, 3, 4, 5\];

//用some来模拟continue的情况  
arr.some(function (item) \{  
if (item === 2) \{  
return; // 不能为 return false  
\}  
console.log(item);  
\});

//用every模拟break的情况  
var arr = \[1, 2, 3, 4, 5\];  
arr.every(function (item) \{  
console.log(item);  
return item !== 3;  
\});

</script>  
  
(2)二维数组

第一种方法：中括号中含中括号，例如：  
let arr=\[\[\],\[\],\[\]\]

第二种方法：先new Array(),再在一维数组中再new Array()  
let arr=new Array();  
for(let i=0;i<arr.length;i++)\{  
let arr\[i\]=new Array();  
for(let j=0;j<arr2.length;j++)\{  
arr\[i\]\[j\]="";  
\}  
\}

\---------------------------------------------------------

六、函数

第一：函数的定义  
function a()\{  
alert("alksdfjalsdf");  
\}  
//再调用  
a();

第二：匿名函数  
<script type="text/javascript">  
let a=function aa()\{  
console.log("abcdefg");  
\}  
a();  
</script>

第三种：直接运行的函数 ()();  
<script type="text/javascript">  
(function x(w)\{  
console.log(w)  
\})(3);  
//3是实参，它传给了w  
</script>

第四种 ：javaScript的lambda表达式  
<script type="text/javascript">  
let a=()=>\{console.log(10)\};  
a();  
</script>

\-------------------------------------------------------------  
七、实例：写一个网页版的加法程序，添加一些javaScript操作DOM的功能；<!DOCTYPE html>  
<!DOCTYPE html>  
<html>  
<head>  
<meta charset="utf-8" />  
<title></title>  
</head>  
<body>  
<form>  
请输入加数：<input type="text" name="jiaShu" id="jiaShu" /><br />  
请输入被加数：<input type="text" name="beiJiaShu" id="beiJiaShu" /><br />  
结果：<input type="text" name="he" id="he" /><br />  
<input type="button" name="btn" id="btn" value="提交" οnclick="qiuHe();"/>  
<input type="reset" name="rebtn" id="rebtn" value="重置" />  
</form>  
</body>  
</html>