JavaScript之面向对象学习笔记

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/zym326975/article/details/84537761

JavaScript对象

将相关的变量和函数组合成一个整体，这个整体叫对象，对象中的变量叫做属性，变量中的函数叫做方法。

JavaScript创建对象的方法

1、单体模式

2、工厂模式

<script type="text/javascript">
	function Person(name,age,job){ 

		var o = new Object();

		o.name = name;
		o.age = age;
		o.job = job; 

		o.showname = function(){
			alert(this.name);
		}

		o.showage = function(){
			alert(this.age);
		}

		o.showjob = function(){
			alert(this.job);
		}

		return o;
	}

	var Tom = Person('tom',18,'engineer');
	var Jack = Person('jack',19,'worker');

	Tom.showjob();
	Jack.showjob();
</script>

3、构造函数

<script type="text/javascript">

	function Person(name,age,job){

		this.name = name;
		this.age = age;
		this.job = job;

		this.showname = function(){
			alert(this.name);
		}

		this.showage = function(){
			alert(this.age);
		}

		this.showjob = function(){
			alert(this.job);
		}
	}

	var Tom = new Person('tom',18,'engineer');
	var Jack = new Person('jack',19,'worker');

	Tom.showjob();
	Jack.showjob();
</script>

4、原型模式

<script type="text/javascript">

	function Person(name,age,job){

		this.name = name;
		this.age = age;
		this.job = job;
	}

	Person.prototype.showname = function(){
		alert(this.name);
	}

	Person.prototype.showage = function(){
		alert(this.age);
	}

	Person.prototype.showjob = function(){
		alert(this.job);
	}

	var Tom = new Person('tom',18,'engineer');
	var Jack = new Person('jack',19,'worker');

	Tom.showjob();
	Jack.showjob();

</script>

JavaScript类的继承

<script type="text/javascript">

	function Fclass(name,age){

		this.name = name;
		this.age = age;

	}

	Fclass.prototype.showname = function(){
		alert(this.name);
	}

	Fclass.prototype.showage = function(){
		alert(this.age);
	}

	function Sclass(name,age,job){
		Fclass.call(this,name,age);
		this.job = job;
	}

	Sclass.prototype = new Fclass();
	Sclass.prototype.showjob = function(){
		alert(this.job);
	}

	var Tom = new Sclass('tom',18,'engineer');
	Tom.showname();
	Tom.showage();
	Tom.showjob();

</script>