网页前端第六次培训

xy儿

已于 2022-02-10 16:32:13 修改

阅读量85

点赞数

文章标签：前端

于 2022-02-10 16:30:01 首次发布

本文链接：https://blog.csdn.net/qq_65874997/article/details/122863771

版权

一，数组

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>数组</title>
	</head>
	<body>	
	 <script type="text/javascript">
	 	/* 数组的定义 */
		//1.隐式定义
		var arr1=[];
		console.log(arr1);
		var arr2=[1,2,'a',true];
		console.log(arr2);
		
		//2.直接实例化
		var arr3=new Array(1,2,3);
		console.log(arr3);
		
		//3.定义数组并设置长度
		var arr4=new Array(5);
		console.log(arr4);
		
		console.log("===================");
		/* 数组的操作 */
		//获取数组指定下标的值
		console.log(arr2[1]); // 2
		//如果下标不存在
		console.log(arr2[10]); // undefinded
		//设置指定的下标
		arr2[1] = 20;
		console.log(arr2);
		//如果下标不存在
		arr2[10] = 100;
		console.log(arr2);
		//获取数组的长度
		console.log(arr3, length);
		//设置数组的长度
		arr3.length = 5;
		console.log(arr3);
		//设置数组的属性
		arr3.name = "zhangsan"
		
		console.log("===================");
		/* 数组的遍历 */
		
		console.log("---for循环遍历---");
		for(var i=0; i< arr3.length; i++){
			console.log("下标：" + i + "值" + arr3[i]);
		}
		
		console.log("---for..in循环遍历---");
		for(var i in arr3){
			console.log("下标：" + i + "值" + arr3[i]);
		}
		
		console.log("---forEach循环遍历---");
		arr3.forEach(function(element, index){
			console.log("下标：" + i + "值" + element);
		})
		
		console.log("===================");
		/* 数组提供的方法 */
		var arr5 = ["a","b","c"];
		//push        添加元素到最后
		arr5[arr5.length] = "d";
		arr5.push("e");
		console.log(arr5);	
		
		//join        数组转换为字符串
		console.log(arr5.join("."));
		
		//index0f     数组元素索引
		console.log(arr5.indexOf("a"));//0
		console.log(arr5.indexOf("t"));//-1
		
		//splice      剪切数组，原数组变化，可以实现前后删除效果
		var str = "1,2,3,4,5";
		console.log(str.split(","));
		
	 </script>
	</body>
</html>

二，函数

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>函数</title>
	</head>
	<body>
	 <script type="text/javascript">
	 	/* 函数的定义 */
		//1.函数声明语句
		function fn01(a, b) {
			console.log(a+b);
		}
		console.log(fn01);
		//2.函数定义表达式
		var fn02 = function(a, b) {
			console.log(a+b);
		}
		console.log(fn02);
		//3.Function构造函数
		var fn03 = new Function('a','b', 'return (a+b);');
		console.log(fn03);
		//相当于
		function fn04(a,b) {
			return (a+b);
		}
		fn02(1,2);//3
		
		console.log("===================");
		/* 函数的参数 */
		//1.实参可以省略,则形参为undefinded
		function test01(x, y) {
			console.log(x+y);
		}
		//调用函数
		//未设置函数
		test01(); //NaN
		test01(1); //NaN
		test01(1,2); //3
		
		//2.如果形参名相同,则以最后一个参数为准
		function test02(x, x) {
			console.log(x);
		}
		test02(1, 2);// 2
		
		//3.可以设置参数的默认值
		function text03(x){
			//如果形参x有值,则值为x传递的值,否则值为"x"
			x = x ||"x";
			console.log(x);
		}
		text03(10); // 10
		text03(); //x
		function text04(x) {
			(x != null && x !=undefined) ? x = x : x = "x";
			console.log(x)
		}
		text04();
		text04("Hello");
		
		//4.参数为值传递,传递副本;参数是引用传递,则传递的是地址,操作的是同一个对象
		//变量
		var num = 10;
		//函数
		function text05(num) {
			num = 20;
		}
		//调用函数
		text05(num); //实参是定义的变量
		console.log(num);
		
		var obj = {name:"zhangsan"};
		console.log(obj);
		function text06(o) {
			o.name = "lisi"
		}
		text06(obj);
		console.log(obj);
		
		console.log("===================");
		/* 函数的调用 */
		// 常用调用方式
		function f1() {
			console.log("常用调用方式...");
		}
		f1();
		//函数调用方式
		var f2 = function(a) {
			console.log("函数调用方式...");
			return a;
		}
		var num1 = f2(1);
		console.log(num1);
		//方法调用方式
		//定义对象  key键:字符串 value:
		var obj = {
			name:"zhangsan", //字符串
			age:10, //数值
			sex:true, //布尔
			cats:["大猫","二猫"], //数组
			dog:{ //对象
				name:"张二狗",
				age:1
			},
			sayHello:function() { //函数
				console.log("你好啊~");
			}
		}
		console.log(obj);
		console.log(obj.sayHello()); //对象调用函数,无返回值
		obj.sayHello(); 
		
		console.log("===================");
		/* 函数的返回值 */
		function a1(){
			console.log("没有返回值....");
			return;
			console.log("...........");
		}
		console.log(a1());
		
		function a2(){
			console.log("有返回值....");
			return "test";
		}
		console.log(a2());
		
		
		console.log("===================");
		/* 函数的作用域  */
		var pp = "hello"; //全局变量
		//函数中定义的变量是局部变量
		function qq(){
			//局部变量 
			var box = 10;
			//全局变量(没有使用var修饰符声明,属于全局变量)
			box2 = 20;
		}
		//调用方法,执行方法中的代码
		qq();
		console.log(qq());//全局变量
		//console.log(box); //局部变量
		console.log(box2);
		
	 </script>
	</body>
</html>

xy儿

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
网页前端第六次培训

一，数组<!-- 数组数组的定义 1.隐式定义 var 数组名 = []; //空数组 var 数组名 = [值1，值2，值3...]; 2.直接实例化 var 数组名 = new Array(值1，值2，值3...); 3.定义数组并设置长...
复制链接

扫一扫