cgb2110-day10

cgblpx

已于 2022-02-09 09:10:04 修改

阅读量5.1k

点赞数 6

分类专栏： cgb2110班的笔记文章标签： java

于 2021-12-07 09:00:26 首次发布

本文链接：https://blog.csdn.net/u012932876/article/details/121760864

版权

cgb2110班的笔记专栏收录该内容

19 篇文章 76 订阅

订阅专栏

文章目录

重点难点!! 一,JS的函数

–1,定义函数调用函数

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>测试 JS函数</title>
		<script>
			//练习1:封装函数,求数组里偶数的和
				// function sum(){ //方式1
				let sum = function(){  //方式2
					//1,创建数组
					let arr = [1,2,3,4,5,6,7,8];
					//2,遍历数组
					let sum2=0;//定义变量,记录和
					//for(let i=0;i<arr.length;i++){
					for(let i in arr){//i是下标,arr[i]是数据
						//3,过滤偶数
						if(arr[i] % 2 === 0){
							//4,求和	
							sum2+=arr[i];
						}
					}
					console.log(sum2);
				}
			//1,创建函数
				//方式1:
				function add(){
					console.log("add..被调用成功!");
				}
				//方式2:
				var a = function(){
					console.log("a..被调用成功!");
				}
			//2,调用函数
				add();
				a();
		</script>
	</head>
	<body>
		<button onclick="sum()">点我,获取数据</button>
		
		
	</body>
</html>

–2,函数传参

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>测试 JS函数</title>
		<script>
			//改造练习1:封装函数,求数组里偶数的和
			// function sum(){ //方式1
			let sum = function(arr){  //方式2
				//2,遍历数组
				let sum2=0;//定义变量,记录和
				//for(let i=0;i<arr.length;i++){
				for(let i in arr){//i是下标,arr[i]是数据
					//3,过滤偶数
					if(arr[i] % 2 === 0){
						//4,求和	
						sum2+=arr[i];
					}
				}
				console.log(sum2);
			}
			//调用函数
			let a =[4,5,6,7,8,89,10];
			sum(a);
			
			//1,创建函数
			function print(x){
				console.log(x);
			}
			function add(x,y){
				console.log(x+y);
			}
			//2,调用函数
			print('abc');
			add(1,2);
		</script>
	</head>
	<body>
	</body>
</html>

–3,函数的返回值

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>测试 JS函数</title>
		<script>
			//练习2:模拟set设置值 / get获取值
				//创建函数
				//set()把调用者传来的参数设置值
				let name = '';
				function set(x){
					name = x;//设置值
				}
				//get()把值返回给调用者
				function get(){
					return name ;
				}
				//调用函数	
				set('jack'); //设置值
				let name2 = get();//获取值
				console.log(name2);
			//练习1:创建函数,求1~10的和并返回
			function save(){
				let sum =0;
				for(let i=1;i<=10;i++){
					sum += i;
				}
				//谁要调用这个函数,谁即将保存着return的值
				return sum;
			}
			let a2 = save();
			console.log(a2);
			//1,创建函数--通过return把结果返回给调用者
			let add = function(x,y,z){
				//通过return把结果返回给调用者
				return x+y+z;
			}
			//2,调用函数
			let a = add(1,2,3);
			console.log(a);
		</script>
	</head>
	<body>
	</body>
</html>

–4,总结

在这里插入图片描述

二,JS对象

–1,内置对象

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>测试 js对象</title>
		<script>
			//1,JS的内置对象
			function test1(){
				//String对象的功能
				let a = 'javascript';
				console.log( a.length ); //获取字符串的长度
				console.log( a.toUpperCase() ); //全转大写
				let b = a.substring(1,5); //截取字符串[1,5)
				console.log( b ); 
				console.log( a.concat('hello ~') );  //拼串
				//Math对象
				console.log( Math.PI );//π的值
				console.log( Math.random() ); //随机数0~1
				console.log( Math.random() * 10 );
				console.log( Math.round(1.9) );//对小数的处理,round四舍五入
				console.log( Math.round(1.1) );//对小数的处理,round四舍五入
				//Array对象
				let c = [3,2,4,5,2];
				console.log( c );
				console.log( c.toString() );//打印数组里的数据
				console.log( c.sort() ); //对数组排序,默认从小到大
				//window对象--可以省略
				window.alert(100);//弹出框
				window.prompt(); //输入框
				window.confirm() ;//确认框
				//DOM 
				Document d = window.document;
				//JSON
			}
		</script>
	</head>
	<body>
		<!--2,调用函数  -->
		<button onclick="test1()">单击按钮</button>
	</body>
</html>

–2,自定义对象方式1

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>测试 js对象!!!!</title>
		<script>
			//练习:创建Car对象
			function Car(){}
			let c = new Car();
			//动态的添加属性或者函数
			c.color='red';
			c.start=function(){
				return '启动成功!'
			}
			//模拟tostring(),返回属性的值
			c.tostring=function(){
				//this代表当前的对象
				return "["+this.color+"]" ;
			}
			console.log(c);
			//调用属性或者函数
			let str = c.tostring();
			console.log(str);
			let res = c.start();
			console.log(res);
			console.log( c.color );
			
			
			
			
			
			
			//方式1!!:
				//1,声明对象
				function Person(){}
				//2,创建对象
				var p = new Person();
				//3,动态的给对象绑定属性
				p.name="rose";
				p.age=20;
				console.log(p);//Person {name: 'rose', age: 20}
				//4,动态的给对象绑定函数
				p.study = function(){
					console.log(100);
				}
				console.log(p);//?
				//5,调用对象的功能
				console.log( p.name );
				console.log( p.age );
				p.study();
			//方式2!!!!:
			
		</script>
	</head>
	<body>
		<button>点我,获取数据</button>
	</body>
</html>

–3,自定义对象方式2

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>测试 js对象!!!!</title>
		<script>
			//练习:创建JS对象对并调用
			let person= {
				name : "蔡徐坤",
				like : "唱跳rap",
				play : function(a){
					return a;
				}
			}
			console.log(person.name+person.like);
			let a = person.play('篮球');
			console.log(a);
			
			//1,创建JS对象
			let student = {
			   //属性名 : 属性值
				name : "jack" ,
				age : 18 ,
			    //函数名 : 函数声明
				coding : function(){
					console.log(100);
				} 
				,
				tostring:function(){
					return this.name+","+this.age ;
				}
			}
			//2,调用对象的功能
			let res = student.tostring();
			console.log(res);
			
			student.coding();
			console.log(student.name + student.age);
			//{name: 'jack', age: 18, coding: ƒ}
			console.log(student);
		</script>
	</head>
	<body>
	</body>
</html>

三,Json

–1,概述

是一种轻量级的数据交互格式.本质上就是一个字符串(文本).
作用: 用来完成前后端数据交互的格式 , 存储和管理数据.

–2,语法

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>测试 JSON串</title>
		<!-- json用来把 前后的数据 进行交互 -->
		<script>
		//解决方案:如果能把一个json字符串转成js对象,就能通过对象调用属性啦--JSON对象
			var c = '[{"name":"jack","age":"20"},{"name":"rose","age":"22"}]'
			var jsobj = JSON.parse(c);//把json串转成js对象
			console.log(jsobj);//得到一个数组
			console.log(jsobj[0].name);//调用对象的属性,jack 
			console.log(jsobj[1].name);//调用对象的属性,rose 
			
			//3,json数组
			console.log(c);
			//需求:把json串里的 jack 和 rose获取到 
			console.log(c.substring(10,14));//jack 
			console.log(c.substring(37,41));//rose 
			
			//2,json对象
			var b = '{"name":"18","age":"20"}';
			console.log(b);
			console.log(b.length);//获取长度
			console.log(b.concat(100));//拼接
			console.log(b.substring(1,5));//截取
			//1,json字符串
			var a = '"name":"熊大"' ;
			console.log(a);
			console.log(a.length); //获取长度
			console.log( a.concat(123) ); //拼接
			console.log( a.substring(2,6) ); //截取[2,6)
			
		</script>
	</head>
	<body>
	</body>
</html>