3. js基础

1.JavaScript:是一种基于对象和事件驱动的脚本语言.后缀名:.js
JavaScript也是边解释边执行的语言.

2.JavaScript的作用:
2.1:表单验证,增加网站安全.
2.2:动态特效,提高用户体验度.
2.3:驱动事件的执行,增强用户交互性.

3.JavaScript的组成:ECMAScript(js的基础语法),DOM(文档对象模型),BOM(浏览器对象模 型).

4.JavaScript是一种弱类型语言.

5.页面引入JavaScript的方式
5.1:行内JavaScript:只能在标签中使用.
eg:

java开发人员学JS的目标

5.2:内部JavaScript:可以在html里面任何地方使用.
	eg:<!--内部js-->
		<script type="text/javascript">
			alert("这是一个内部js");
	   </script>

5.3:外部JavaScript:先写外部js文件,再在html页面中引入
	eg:<!--引入外部的js-->
	  <script type="text/javascript" src="js/1.js"></script>

6.JavaScript的输出方式:
//第一种弹出窗体输出
alert(“Hello JavaScript”);
//第二种在body中输出
document.write(“Hello china”);
//第三种在控制台输出
console.log(“Hello World”);

7.JavaScript的变量
7.1:声明变量: var 变量名;
7.2:给变量赋值: 变量名=值;
7.3:声明变量的同时赋值: var 变量名=值;
eg://声明变量
var weight;
var name;
//给变量赋值
name=“八戒”;
//给变量声明同时赋值
var age=18;
var isGF=false;
var sex=“男”;
var height=1.80;

		//在js中声明变量也可以用var (不推荐)
		address="千锋";
		
		document.write(weight+"<br/>");
		document.write(name+"<br/>");
		document.write(age+"<br/>");
		document.write(isGF+"<br/>");
		document.write(sex+"<br/>");
		document.write(height+"<br/>");
		document.write(address+"<br/>");

8.JavaScript的数据类型:number,string,boolean,object,undefined,function
注意:在javaScript中如果变量省略 value 参数,或者设置为 0、-0、null、""、 false、undefined 或 NaN,则该对象设置为 false.
eg:var a=0;

		if (a) {
			document.write("a的值为true");
		}else{
			document.write("a的值为false");
		}

8.1:获得变量的数据类型: typeof(变量)
8.2:获得变量的数据类型: typeof 变量
eg://判断变量的数据类型
		document.write(typeof(weight)+"<br/>");
		document.write(typeof name+"<br/>");
		document.write(typeof(age)+"<br/>");
		document.write(typeof(isGF)+"<br/>");
		document.write(typeof(sex)+"<br/>");
		document.write(typeof(height)+"<br/>");
		document.write(typeof(address)+"<br/>");

9.javaScript中运算符(算术运算符,关系运算符,赋值运算符,逻辑运算符)与java中用法是一 样.
注意:==比较是变量的值,与数据类型无关;===比较是变量的值和数据类型
eg:var num1=“11”;
var num2=11;
var num3=11;

		//==比较是变量的值,与数据类型无关
		//在javaScript中所有变量都可以用==比值.
		document.write(num1==num2);//true
		document.write("<br/>")
		document.write(num2==num3);//true
		document.write("<br/>")
		//===比较是变量的值和数据类型
		document.write(num1===num2);//false
		document.write("<br/>")
		document.write(num2===num3);//true
		document.write("<br/>")

10.JavaScript的数组:像java中数据和集合综合体.
10.1:数组的声明:
eg://第一种声明数组
var arr1=[“苹果”,“菠萝”,“山竹”];

		//第二种声明数组
		var arr2=new Array();
		//给数组每个空间赋值
		arr2[0]="看直播";
		arr2[1]="吃饭";
		arr2[2]="睡觉";
		
		//第三种声明数组
		var arr3=new Array(2);
		//给数组每个空间赋值
		arr3[0]="lol";
		arr3[1]="吃鸡";
		arr3[2]="修仙";
		
		//第四种声明数组
		var arr4=new Array("火锅","烤肉","泡馍");

10.2:向数组中添加值
	eg://第一种:向数组中添加值
		arr4[3]="烧烤"
		
		//第二种:向数组末尾添加元素
		arr4.push("啤酒","小龙虾");
		
		//第三种:向数组开头添加元素
		arr4.unshift("猪脚饭");

10.3:修改数组中值
	eg://第一种:修改数组中元素
		arr4[0]="白切鸡";
		
		//第二种:修改数组中元素,第一个参数要删除元素起始索引,
				//第二个参数要删除的元素个数,后面参数就是添加到删除位置的元素
		arr4.splice(1,2,"烤竹鼠","榨菜");
	
10.4:删除数组中值
	eg://第一种:删除数组中指定索引的元素的值,位置还在
		arr4[0]=undefined;
		
		//第二种:删除数组中最后一个元素.
		arr4.pop();
		
		//第三种:删除数组中第一个元素
		arr4.shift();
		
		//第四种:删除数组中指定索引处,指定个数的元素,第一个参数要删除元素的起始索引,第二个参数要删除的元素个数
		arr4.splice(1,2);
		
		//第五种:删除指定元素的值,位置还留着
		delete arr4[0];
		
		//第六种:删除数组中所有元素
		arr4.length=0;

10.5:遍历数组	:
	eg:for(var i=0;i<arr4.length;i++){
			document.write(arr4[i]+"<br/>");
		}

11.JavaScript中选择结构和while,do-while,for与Java中用法一样.
注意:JavaScript中没有foreach结构,但是有for-in
11.1:JavaScript中,for-in遍历数组,遍历的是数组索引;for-in遍历对象,
遍历的是对象的属性
///声明一个数组
var arr1=[“耳朵到”,“眼到”,“心到”];
//for-in遍历数组,遍历的是数组索引
for(var i in arr1){
document.write(i+"\t"+arr1[i]+"
");
}
/

		//for-in遍历对象,遍历的是对象的属性
		var ob={"name":"张三","age":18};
		for(var i in ob){
			document.write(i+"<br/>");
		}

12.函数:相当于java中方法.
12.1:自定义普通函数:function 函数名(参数1,参数2…){
[return 返回结果;]
}
eg://第一种:声明无参无返回值的方法
function show1(){
alert(“这是一个无参无返回值的方法”);
}

		//第二种:声明有参无返回值的方法
		function show2(a,b){
			alert("这是一个有参无返回值的方法,方法的参数为:"+a+","+b);
		}
		
		//第三种:声明无参有返回值的方法
		function show3(){
			var word="这是一个无参有返回值的方法";
			return word;
		}
		
		//第四种:声明有参有返回值的方法
		function show4(a,b){
			var word="这是一个有参有返回值的方法,参数为:"+a+","+b;
			return word;
		}

12.2:自定义匿名函数:var 变量名= function(参数1,参数2...){
							[return 结果;]
						}
	eg://第五种:声明匿名函数
		var a=function(c,d){
			var word="这是一个匿名函数,参数为:"+c+","+d;
			return word;
		}

12.3:函数的调用:
	12.3.1:普通函数调用:函数名(实参1,实参2...);
					var 变量=函数名(实参1,实参2...);
	12.3.2:匿名函数的调用: 变量名(实参1,实参2...);
	eg:<input type="button" value="调用无参无返回值的方法" onclick="show1()"/>
		<br />
	<input type="button" value="调用有参无返回值的方法" 
			onclick="show2('孙星',18)"/><br />
	<input type="button" value="调用无参有返回值的方法" 
			onclick="alert(show3())"/><br />
	<input type="button" value="调用有参有返回值的方法" 
		onclick="javascript:alert(show4(11,12))"/><br />
	<input type="button" value="调用匿名函数" 
		onclick="alert(a(17,18))"/><br />

12.4:系统函数:
	isNaN():判断变量是否是数字,不是数字就返回true,反之就返回false
	  eg://isNaN():判断变量是否是数字,不是数字就返回true,反之就返回false
		var num1="abc";
		var num2=11;
		var num3="11";
		document.write(isNaN(num1)+"<br/>");//true
		document.write(isNaN(num2)+"<br/>");//false
		//注意:isNaN()只判断变量的值,与数据类型无关
		document.write(isNaN(num3)+"<br/>");//false
		
	parseFloat():将变量转换为带小数的数字
	parseInt();将变量转换为整数的数字
		eg://parseFloat():将变量转换为带小数的数字
		//parseInt();将变量转换为整数的数字
		var num4="11";
		var num5="3.14";
		//将两个变量进行字符串的连接作用
		document.write(num4+num5+"<br/>");
		//进行数学运算
		document.write(parseInt(num4)+parseFloat(num5)+"<br/>");
		document.write(parseInt(num5)+"<br/>");//3
		document.write(parseFloat(num4)+"<br/>");//11

	eval();可以js字符串转换js代码执行
	 eg://eval();可以js字符串转换js代码执行
		var ob1="{'name':'胡青松','age':18}";
		document.write(typeof ob1);//string
		document.write("<br/>");
		var ob2=eval("("+ob1+")");
		document.write(typeof ob2);//object
		document.write("<br/>");
		document.write(ob2.name+","+ob2.age);
		document.write("<br/>");

おすすめ

転載: blog.csdn.net/qq_44949002/article/details/120278251