js的类和对象

最新推荐文章于 2024-01-16 16:42:49 发布

you些话

最新推荐文章于 2024-01-16 16:42:49 发布

阅读量719

点赞数

分类专栏： js

本文链接：https://blog.csdn.net/weixin_44805105/article/details/110532142

版权

js 专栏收录该内容

23 篇文章 0 订阅

订阅专栏

js中的类学习：

			1、类的声明:
				function 类名(形参1，形参2……){
					this.属性名1=形参1;
					this.属性名2=形参2;
					……
					this.属性名=fn
				}
			2、类的使用:
				var 对象名=new 类名(实参1，实参2……);
				注意：
					js中类的内容只是对象的公共部分，每个对象还可以自定义的进行扩充。
			3、类的"继承"：prototype关键字
			、	同过prototype关键字实现了不同对象之间的数据共享。
				作用1:实现某个类的所有子对象的方法区对象的共享，节省内存

类的声明及使用

!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>js的类和对象</title>
		<script type="text/javascript">
			//1.类的声明
function Person(name,age){			
				this.name=name;
				this.age=age;
				this.fav="唱歌";
				this.test=function(a){
					alert(a);
				}
			}
        var p1=new Person("张三",32);
        p1.address="北京市";//北京市
		alert(p1.address);//北京市
		alert(p1.name);//张三
		var p2=new Person("李四",23);
		alert(p2.name);//李四
        alert(p1.test===p2.test);//false
        	</script>
	</head>
	<body>
	</body>
</html>

16 20行为new一个Person对象。22行结果显示p1和p2的test不是同一个对象，如果有大量Person对象使用该方法，则会浪费内存。解决方法使用“继承”prototype。
同时17行中显然Person类中没有address属性，但依然可以调用使用，不过该属性只属于P1对象，p2无法调用。

使用prototype 类似与java中的继承

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>js的类和对象</title>
		<script type="text/javascript">
			//1.类的声明
			function Person(name,age){
				this.name=name;
				this.age=age;
				this.fav="唱歌";
				/*this.test=function(a){
					alert(a);
				}*/
			}
			Person.prototype.test=function(){alert("hh")};
            var p1=new Person("张三",32);    
            var p2=new Person("李四",23);
            alert(p1.test===p2.test);//true
            </script>
	</head>
	<body>
	</body>
</html>

此时p1和p2调用的test为同一个对象方法

如何用一个类对象调用另一个类属性？

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>js的类和对象</title>
		<script type="text/javascript">
			//1.类的声明
			function Person(name,age){
				this.name=name;
				this.age=age;
				this.fav="唱歌";
				/*this.test=function(a){
					alert(a);
				}*/
			}
			function User(uname,pwd){
				this.uname=uname;
				this.pwd=pwd;
			}
			Person.prototype.test=function(){alert("hh")};
			Person.prototype.user=new User();
			User.prototype.testU=function(){alert("我是user")};
            var p1=new Person("张三",32);    
          p1.user.testU();//我是user
          p1.test();//hh
            </script>
	</head>
	<body>
	</body>
</html>

优化

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>js的类和对象</title>
		<script type="text/javascript">
			//1.类的声明
			function Person(name,age){
				this.name=name;
				this.age=age;
				this.fav="唱歌";
				/*this.test=function(a){
					alert(a);
				}*/
			}
			function User(uname,pwd){
				this.uname=uname;
				this.pwd=pwd;
			}
			Person.prototype.test=function(){alert("hh")};
			//Person.prototype.user=new User();
			Person.prototype=new User();
			User.prototype.testU=function(){alert("我是user")};
            var p1=new Person("张三",32);    
          p1.testU();//我是user
         // p1.test();//hh
            </script>
	</head>
	<body>
	</body>
</html>

若将21行换成22行代码，可直接p1.testU()调用另一个类的属性方法，但是此时20行代码相当于被注释掉 p1.test()也不再起作用，但仍然可以调用Person类中原有的属性和方法（name age）。

自定义类对象

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>js的自定义对象</title>
	<script type="text/javascript">
		//创建自定义对象
		var bj=new Object();
		obj.name="张三";\
		obj.age=23;
		obj.test=function(){
			alert("我是obj");
		}
		
		
	</script>
	
	
	</head>
	<body>
	</body>
</html>

		js创建自定义对象
			对象的作用：用来存储整体数据。
			原因：很多时候我们没有办法预先知道一个对象应该有哪些属性，所以只能临时的创建一个对象来自定义属性存储数据。来保证数据的完成性
			应用：
				Ajax中会使用。
			使用：
				1、创建自定义对象
					var 对象名=new Object();
						对象名.属性名1=属性值1;
						对象名.属性名2=属性值2;
						对象名.属性名3=属性值3;
						……
					
					var 对象名={};
						对象名.属性名1=属性值1;
						对象名.属性名2=属性值2;
						对象名.属性名3=属性值3;
						……
				2、一般用来存储数据，不会再自定义对象中存储函数对象。
				3、js中的对象属性和内容是可以自定义的扩充的，不是依赖于类的声明的，类只是对象公共部分的一种声明，是为了节省代码的冗余的。	
	-->

you些话

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
js的类和对象

类的声明及使用!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>js的类和对象</title> <script type="text/javascript"> //1.类的声明function Person(name,age){ this.name=name; this.age=age; this.fav="唱
复制链接

扫一扫