代码放在E:JSjs学习
学习中要学会多查手册
javascript基本介绍
- js是用于web开发的脚本语言。
- 后面统称为 js
脚本语言是什么？
- 脚本语言不能独立使用，它和html/jsp/php/asp/asp.net等配合使用。
- 脚本语言有自己的变量，函数，控制语句(顺序，分支，循环)。
- 脚本语言实际上是解释性语言(说白了：在执行的时候直接对源码进行执行，不用对源码进行转化)。
- javascript执行引擎：-->浏览器(js引擎来解释执行的)。
解释性语言和编译语言的区别？
- 编译语言执行效率高。
js 在客户端与浏览器之间的执行原理：
总结：
js会随着请求返回的页面一起返回，在本地计算机上的浏览器上执行。
第一个程序hello world(万变不离其宗；学语言的基本)
案例一：
需求：打开网页后；显示 hello world！
<!DOCTYPE html><!-- 开头声明文档类型(为html文档：html5的写法) --> <html> <head> <meta charset="utf-8"><!-- 设置编写代码格式，不写容易被浏览器解析的时候乱码 --> <!-- js代码一般是放在head标签间，单实际上也可以放在别的位置 --> <script type="text/javascript"> window.alert("hello world"); </script> </head> <body> </body> </html>
问题：
1. js的位置？
js的位置可以随意；我们在页面中的代码；一般对应js功能写在对应代码后面；外部引入的一般加在最后面。这样利于页面的加载。
2. js代码要包含在<script></script>标签里面；
问题：如果不包含在里面结果会怎样？
代码会被当做文本输入。
3. 当页面中有多个<script></script>标签包含的代码的时候；会按从上到下的顺序依次执行
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<script type="text/javascript">
window.alert("hello world1");//我第一个先执行
</script>
<script type="text/javascript">
window.alert("hello world2");//当第一个执行完了我第二个执行
</script>
<script type="text/javascript">
window.alert("hello world3");//当第二个执行完了我第三个执行
</script>
</body>
</html>
案例二：
需求：对程序改进，让程序成为一个简单的加法运算。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<script>
//js中变量的表示 var，不管实际类型；
var num1 = 45;
var num2 = 89;
var result = num1 + num2;
window.alert("结果是：" + result);
</script>
</body>
</html>
总结：
- 在js中所有的变量都是有 var 表示的；不管实际类型。
- 从结果我们直到；字符串和数字相加(" + ")；会自动将数字转换成字符串然后字符串间进行拼接。
- alert:属于window对象；我们查手册；对其的描述
问题：为什么需要变量？js中变量的数据类型是由什么决定的那？
- 1. 不论那种语言；都有变量。变量是程序的基本组成单位；
- 2. js是弱数据类型语言。-->针对强数据类型而言的；比如 java；
问题：什么是弱数据类型语言？
解释：在定义变量的时候；统一由 var 表示；甚至可以去掉 var 这个关键字。
<script>
num1 = 45;
num2 = 89;
result = num1 + num2;
window.alert("结果是：" + result);
</script>
上面这段代码，在html页面中的执行结果和上面加了 var 的代码执行结果一样；但是他们还是有区别的；后面在分析。
3. 那是不是说明js没有数据类型那？如果有的话；由什么决定的那？
a. 是有数据类型的。
b. 数据类型的决定是由 js 引擎决定的。
var name = "haha";//此时js引擎会认为name是字符串类型
var kk = 2；//此时js引擎认为kk是数字类型
var yy //js引擎会认为yy是undefined
//如果此时重新定义name
name = 123;//这时name会自动变成数字类型。
//不声明变量直接使用
x = 64；//这样定义也可以使用
js的基本语法
一 js标识符
- js中定义的符号：如变量名，函数名，数组名等；
- 标识符由任意顺序的 大小写字母，数字，下划线(_)和美元符($)组成。
- 但那时不能以数字开头。
- 不能使用js中的保留，关键字。可查文档；javascript保留字，javascript关键字。关键字-->现在已经在用的；保留字-->现在没用以后可能用而保留起来的。
- js中是严格区分大小写的。num = 2 和 Num = 2；不是同一个变量。(html标签不区分大小写)
- 每条功能执行语句的最后必须用分号(英文输入法下的分号" ; " )结束。
- 每个词之间用空格，制表符，换行符或者大括号，这样的分隔符隔开。
- 语句块用 { } 来表示。
- 为了美观注意js的书写格式。保证代码的可读性和实用性。
二 js注释
1. 单行注释： // 要注释的单行注释代码
2. 多行注释： /* 要注释的多行代码 */
三 js数据类型
问题：既然js是弱数据类型，能不能查看它的类型那？
通过 typeof 可以看到变量的具体数据类型是什么。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script>
var v1 = "abc";
var v2 = 89;
window.alert("v1的数据类型：" + typeof v1); //结果在浏览器弹出：v1的数据类型：string
window.alert("v2的数据类型：" + typeof v2); //结果在浏览器弹出:v2的数据类型：number
v1 = 33;//体现js动态语言；变量随时可以变的
window.alert("v1的数据类型：" + typeof v1); //结果在浏览器弹出:v1的数据类型：number
</script>
</head>
<body>
</body>
</html>
基本数据类型
1. Number:数字类型
整数常量(10进制/8进制/16进制)
- 16进制以0x或0X开头，如：0x8a = 8*16+10;那么0x28a = 2*16*16(16的2次方表示)+8*16+10
- 8进制必须以0开头，如：0123 = 3+2*8+1*8*8(8的2次方表示)
- 10进制的第一位不能是0(数字0除外)，如：123
var a = 10; var b = 010;//当我们在10进制前面加0；看运算结果。 结果会将其转化为8进制再进行计算 var c = a+ b; window.alert(c);//结果弹出18；这是转换为8进制的结果。
2. 实数类型(小数)
12.32，1.2，5E3(这个相当于5*10的3次方)等。
3. 特殊数值
NaN(not a number: 不是数值)，Infinity(无穷大)，isNaN()，isFinite()
var a ="abc"; alert(parseInt(a));//会弹出NaN alert(6/0);//会弹出Infinity
说明：
- isNaN()：判断一个值是不是数字：如果是数字；则返回 false；如果不是数字：则返回 true
- isFinite()：判断一个值是不是无穷大，如果是返回 false，如果不是则返回 true
4. 布尔型
true/false
5. String字符串型
用英文输入法下单引号或者双引号包起来的。如："abc"，'javascript'，'123'，" "；如果字符串中有特殊字符，怎需要用反斜杠()后跟一个普通字符来表示，如：
,
, , ", xxx；反斜杠()：转义字符
6. 复合数据类型
7. 特殊数据类型
针对特殊数据类型举例：
1. null： var a = null; // 浏览器会弹出对话框-->内容显示null
2. undefine:
window alert(tt); // 页面不声明 tt，直接使用 tt，浏览器会报错，控制台显示 tt is not undefine
var tt; window.alert(tt);// 结果浏览器会弹出提示框-->提示框内容为 undefine
四、数据类型转换
问题：定义变量，初始化变量，赋值：
定义变量：var a; 这就是定义一个变量；变量名是 a
初始化变量：var a = 45；这就是初始化变量；在定义的时候；就给值
赋值：var a; a = 12; 先定义一个变量；然后给其值；这个然后的给值过程就叫赋值。
1. 自动转换
2. 强制转换
parseInt(要转化的值)：强制转换成整数；parseFloat(要转换的值)：强制转换成小数。
这个要转换的值必须数字开头。
var a = "12345";//此时a是String类型 a = parseInt(a);//利用系统强制转换；此时的a是number型 var b = 90;//表示number型 b = b + "";//此时b是String型。这也是数值转换字符串的一种方式
3.运算符
+；-；*；/；%(取模，两个数相除后的余数)
注意：+：如果是两个数之间用则是 加法运算；如果其中含有字符串则是 拼接(就是直接将将第二个数接在第一个后面)
练习：编写一个js程序判断2个数是不是能够整除？
1 <script> 2 var a = 10; 3 var b = 8; 4 if(a % b == 0){ 5 alert("我是能够整除的结果！"); 6 }else{ 7 alert("我是不能够整除的结果！"); 8 } 9 //注意：两个数相取模的结果。 10 alert(10 % 8);//结果为2 11 alert(8 % 10);//结果为8 12 alert(90.6 % 8);//结果为25.9999999 13 </script>
注意：
取模主要用于整数；从上面的例子可以看出；用在小数上没什么意义。
4. 算数运算符
++(自加) ； --(自减)
- ++：a ++ 等价于 a = a + 1
- --：b -- 等价于 b = b - 1
思考：
var a = 50; var b = ++a; //等价于 a = a+1; b = a alert(a);//结果是多少？ alert(b);结果是多少？ var c = 50; var d = c++; //等价于 d = c; c = c+1 alert(c); //结果是多少？ alert(d);//结果是多少？
总结：b = a++ 和 b = a--：是a先赋值然后在自身 加 或者 减；b = ++a 和 b = --a：是a先自身 加 或者 减了；在赋值。
5.算术运算符
+=(左加)；-=(左减)；/=(左除)；%=(左取模)
大家看案例就明白了
1 var a = 10; 2 a += 5; 3 alert(a);//结果是a = a + 5：是15 4 5 var b = 90; 6 b -= a;//结果是b = b - a：是75 7 alert(b); 8 9 //思考？ 10 var a = 56; 11 var b = 90; 12 a -= 34; 13 b %= a; 14 alert(a);//结果是多少？ 15 alert(b);//结果是多少？