JavaScript 笔记（一）

js的概念

什么是JavaScript?
       是一种直译式脚本语言，是一种动态类型，弱类型的语言，内置支持类型，运行在浏览器端的语言 

 js为什么不能使强类型的语言？
                因为JS是运行在浏览器端的，使用弱类型可以节省客户端在存储数据时开辟的内存，提升效率

作用：

让网页和用户之间可以完成简单的自主交互、增强用户的体验感 用户数据格式的校验 、动态更改网页的背景图片、动态修改HTML元素的文档结构(增加/删除)。

---

js的声明

第一种:直接作用在HTML标签元素中 

<input type="button" value="普通按钮" onclick="alert('你好')"/>

            
第二种：在head标签中使用script标签声明js代码域（不绝对  也可以声明在body标签中）
                

 

<script type="text/javascript">
			alert(123);
		</script>

          

 第三种：在head标签中使用script标签引入外部声明的js文件（也是不绝对）

首先在外部创建一个.js文件，然后在htlm文件中进行调用

<script type="text/javascript" src="../js/myjs.js"></script>

 

 注意：第二种方式和第三种方式在同一个文件中可以同时存在，但是不能合二为一

---

js的变量

1.  变量的声明：
                在js中变量的声明使用关键字var 声明的变量可以接收任意类型的数据

2.变量的作用：
                存储数据

3.变量的使用：
                命名规则：参照Java  见名知意
                变量名严格区分大小写：   A 和a是两个不同的变量
                可以省略结束符号： 但是为了增强可读性，个人不建议省略
可以有同名变量   但是新的值覆盖旧的值

<script type="text/javascript">
			var a = 1;
			var a = 1.2;
			
			alert(a)//在这里变量a的结果就会被后者1.2覆盖了
			
		</script>

4.数据的类型： js中变量没有类型，但是数据有类型 常见的类型有：
                    number:数字类型
                    string:字符串类型
                    object:对象类型
                    boolean:布尔类型
查看某个变量存储的数据类型使用关键字typeof

<script type="text/javascript">
			var a = 1;            //数字类型
			var b = 1.2;          //数字类型
			var c = "asd";        //字符串类型
			var d = new Date();   //对象类型
			var e = true;         //布尔类型
	
			alert(typeof a);      //运行结果：number
			alert(typeof b);      //运行结果：number 
			alert(typeof c);      //运行结果：string 
			alert(typeof d);      //运行结果：object
			alert(typeof e);      //运行结果：boolean
			
		</script>

5.特殊的数据值：
                undefined:在变量声明未赋值的情况下，默认值是undefined，表示未定义
                NaN:当使用Number()函数进行强转的时候，如果传入的不是一个数字数据，返回NaN  not a number
                    NaN属于number类型
                    null:空  是object类型

<script type="text/javascript">
			
			var a = "123s"
			var b = Number(a)
			alert( b)  //返回结果NaN

		</script>

---

js中的运算符

1.算术运算符：+ - * / % ++ --

2.连接符：+   （字符串与任意类型的数据进行拼接）

3.逻辑运算符：== != > >= < <= && & || | !

4.特殊运算符：
      a. 等值符==： 先判断类型，如果类型一致，则直接比较内容，如果内容一致返回true , 反之返回false如果类型不一致，则使用Number()函数进行强转，强转后再比较内容，如果内容一致返回true  反之返回false
                    true -- 1   false -- 0

<script type="text/javascript">
			
			var e1 = 1;    //1
			var e2 = "1";  //1
			var e3 = true; //1
			var e4 = "true";  //NaN
			alert(e1 == e2);   //true
			alert(e1 == e3);   //true
			alert(e1 == e4);   //false
			alert(e2 == e3);   //true
			alert(e2 == e4);   //false
			alert(e3 == e4);   //false
			
		
		</script>

        b. 等同符===：先判断类型，如果类型一致，则直接比较内容，如果内容一致返回true，反之返回false，如果类型不一致，则直接返回false

<script type="text/javascript">
			
			var e1 = 1;    //1
			var e2 = "1";  //1
			var e3 = true; //1
			var e4 = "true";  //NaN
			
			
			alert(e1 === e2);   //false
			alert(e1 === e3);   //false
			alert(e1 === e4);   //false
			alert(e2 === e3);   //false
			alert(e2 === e4);   //false
			alert(e3 === e4);   //false
		</script>

---

js中的流程控制

1.判断语句：
                if()else{}

2. 选择语句：
                switch(){
                    case 值:
                        break;
                        ....
                    default:
                        break;
                }

3. 循环语句：
                while(条件){执行体}
                do{执行体}while(条件);    至少执行一次
                for(初始值;条件;运算方式){执行体}

在流程控制中我们做一个九九乘法表的练习

<script type="text/javascript">
			
			for(var i=1;i<=9;i++){
				for(var j=1;j<=i;j++){

					//将表达式写在页面中
					document.write(j+"*"+i+"="+i*j+"&nbsp;&nbsp;&nbsp;&nbsp;")
				}

				document.write("<br/>");
			}

		</script>

九九乘法表还有另一种的写法，但是运行的结果不是很美观。大家根据自己需求，进行掌握学习

		<script type="text/javascript">
			
			var s = "";
			for(var i=1;i<=9;i++){
				for(var j=1;j<=i;j++){
					s += j+"*"+i+"="+i*j+"     "
					
				}
				s += "\n";
				
			}
 		        alert(s)
		</script>

                

 

 

 注意：在声明流程控制使用的变量时  使用关键字var

---