Javascript第六章JavaScript字面量加数组创建对象第三课

末蓝、 2022-02-18 21:17 249阅读 0赞

Javascript第六章JavaScript用new创建对象第一课  
[https://blog.csdn.net/qq\_30225725/article/details/89304586][https_blog.csdn.net_qq_30225725_article_details_89304586]

Javascript第六章JavaScript中构造器创建对象第二课  
[https://blog.csdn.net/qq\_30225725/article/details/89304743][https_blog.csdn.net_qq_30225725_article_details_89304743]  
Javascript第六章JavaScript字面量加数组创建对象第三课  
[https://blog.csdn.net/qq\_30225725/article/details/89305685][https_blog.csdn.net_qq_30225725_article_details_89305685]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzMwMjI1NzI1_size_16_color_FFFFFF_t_70]

<!DOCTYPE html>
    <html lang="en">
    <head>
    	<meta charset="UTF-8">
    	<title>Document</title>
    	<script type="text/javascript">
    		//字面量
    		var str="welcome to itany."; //字符串字面量
    		var array=[13,35,2,53,23]; //数组字面量
    		var fn=function(){  //函数字面量
    			console.log("welcome to itany.");
    		};
    
    		//对象字面量，多个属性之间以逗号隔开，属性名和属性值之间以冒号隔开
    		var stu={ 
    			name:"tom",
    			age:25,
    			"height":180.5,
    			"js-score":92, //如果属性名不符合强制规范，则必须使用引号引起来
    			study:function(){ 
    				console.log("我是一个学生，正在学习！");
    			},
    			run:function(){ 
    				console.log(this.name+"正在奔跑！");
    			}
    		};
    		console.log(stu.name);
    		console.log(stu.age);
    		console.log(stu["height"]);
    		console.log(stu["js-score"]); //只能使用此方式来访问
    		stu.study();
    		stu["run"]();
    
    	</script>
    </head>
    <body>
    	
    </body>
    </html>

综合练习：

<!DOCTYPE html>
    <html lang="en">
    <head>
    	<meta charset="UTF-8">
    	<title>Document</title>
    	<script type="text/javascript">
    		/* 定义一个学生类型Student 要求具有如下属性和方法： 姓名、年龄、性别、课程分数（html、css、javascript） 显示个人信息的show方法 */
    
    		//方式一
    		/*function Student(name,age,sex,html,css,javascript){ this.name=name; this.age=age; this.sex=sex; this.html=html; this.css=css; this.javascript=javascript; this.show=function(){ console.log("我是一个学生，信息如下："); console.log(this.name+","+this.age+","+this.sex); console.log(this.html+","+this.css+","+this.javascript); }; } var stu1=new Student("唐伯虎",20,"男",92,86,100); stu1.show();*/
    
    		//方式二：改良版
    		/*function Student(name,age,sex,scores){ this.name=name; //基本值 this.age=age; this.sex=sex; this.scores=scores; //对象 this.show=function(){ //函数 console.log("我是一个学生，信息如下："); console.log(this.name+","+this.age+","+this.sex); console.log(this.scores.html+","+this.scores.css+","+this.scores.javascript); }; } var scores={ html:92, css:86, javascript:99 }; var stu2=new Student("唐伯虎",20,"男",scores); stu2.show();*/
    
    
    		/* 定义一个客户类型Customer 要求具有如下属性和方法： 姓名、电话、地址（省份、城市、区域、街道） 显示信息的show方法 */
    		//定义一个地址类型Address
    		function Address(province,city,district,street){ 
    			this.province=province;
    			this.city=city;
    			this.district=district;
    			this.street=street;
    		}
    
    		function Customer(name,phone,address,pets){ 
    			this.name=name;
    			this.phone=phone;
    			this.address=address;
    			this.pets=pets; //添加一个属性pets，表示客户领养的宠物，可以有多个
    			this.show=function(){ 
    				console.log(this.name+","+this.phone+","+this.address.city);
    				console.log("领养的宠物信息如下：");
    				for(var key in pets){ 
    					var pet=pets[key];
    					console.log(pet.name+","+pet.type+","+pet.age);
    				}
    			};
    		}
    		var addr=new Address("江苏省","南京市","秦淮区","龙蟠中路458号3栋一楼");
    		/*var c1=new Customer("秋香","025-88888888",new Address("江苏省","南京市","秦淮区","龙蟠中路458号3栋一楼")); c1.show();*/
    
    
    		//var nums=new Array(); //使用构造函数创建数组，数组也是对象
    		/*var obj=new Object(); var stu=new Student();*/
    		/*var nums=[12,4,24,54,4]; var stu1={name:"tom",age:21}; var stu2={name:"jack",age:25}; var stu3={name:"alice",age:18}; var students=[stu1,stu2,stu3]; //定义一个数组，存储多名学生 for(var i=0;i<students.length;i++){ console.log(students[i].name+","+students[i].age); }*/
    
    		var pets=[
    			{ name:"旺财",type:"大狼狗",age:3},
    			{ name:"Hello Kitty",type:"猫",age:2},
    			{ name:"杰瑞",type:"老鼠",age:3}
    		];
    		var c1=new Customer("秋香","025-88888888",addr,pets);
    		c1.show();
    	</script>
    </head>
    <body>
    	
    </body>
    </html>

[https_blog.csdn.net_qq_30225725_article_details_89304586]: https://blog.csdn.net/qq_30225725/article/details/89304586
[https_blog.csdn.net_qq_30225725_article_details_89304743]: https://blog.csdn.net/qq_30225725/article/details/89304743
[https_blog.csdn.net_qq_30225725_article_details_89305685]: https://blog.csdn.net/qq_30225725/article/details/89305685
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzMwMjI1NzI1_size_16_color_FFFFFF_t_70]: /images/20220219/9f1418f70e444f4887e8d368c60eb96f.png