js里面的几种模式

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>工程模式</title>
</head>
<body>
	<script type="text/javascript">
	    //工厂模式
		function createPerson(name,age,job){
			var o = new Object();
			o.name=name;
			o.age=age;
			o.job = job;
			o.sayName = function(){
				console.log(this.name);
			};
			return o;
		}

		var person1 = createPerson("one",29,"soft");
		var person2 = createPerson("two",30,"shu	jvku");
		person1.sayName();
		person2.sayName();



		//对于工厂模式来说,里面不好的一点就是不能解决其中的对象识别的问题(原因就是两个person都是继承object的,对于构造函数来说就是我们自己定义的新类型,这里不仅仅说是其中的继承object更是继承我们自己定义的对象,更容易识别)



	  //构造函数的模式
	  function Person(name,a){
           
           this.name=name;
           this.a = a;
           // this.sayName = sayName;
           this.sayName = function(){
           	console.log(this.name);
           }

	  }

	  // function sayName(){
	  // 	console.log(this.name);
	  // }

	  var person3 = new Person("liy",[1,2]);
	  person3.sayName();
	  console.log(person3.name);
	   var person4 = new Person("zhang",[1,2]);
	  console.log(person4.sayName===person3.sayName);
	  person4.a.push(3);
	  console.log(person3.a);
	  console.log(person4.a);

	  //对于构造函数里面注意的第一点:函数名字的话首字母大写,这是默认的
	  //第二点的话:创建实例的话里面带有new
	  //还需要注意的就是其中每一个实例之间都是互相独立的.各自是自己的
	  //对于其中的构造函数的缺点就是:每一个实例都要将其中的方法重新创建一遍(对于其中的属性来说还不算啥,但是对于其中的方法来说真的没有那个必要),对语气中的方法来说,将其中的方法写在全局里面,但是这里有很多的不好的地方,这里在全局作用域下面的创建的函数,其中的调用的话还是需要其中的对象来调用,而且每每创建一个函数的话就相当于在全局变量里面创建了很多的对象。还不利用封装





	  //原型模式

	  //对于其中的原型模式最主要体现的就是共享
	  function WangHan(){}

	  WangHan.prototype.name="王涵";
	  WangHan.prototype.sex ="男";
	  WangHan.prototype.sayName=function(){
	  	  console.log("王涵你是小猪猪吗!");
	  }
	  WangHan.prototype.a=[1,2];

	  var xiaohanhan = new WangHan();
	  xiaohanhan.name="王涵喜欢小猪猪";
	  var dahanhan = new WangHan();
	  console.log("xiaohanhan:"+xiaohanhan.name+"dahanhan:"+dahanhan.name);
	  console.log(xiaohanhan.sayName===dahanhan.sayName);
	  console.log(xiaohanhan.a,dahanhan.a);
	  xiaohanhan.a.push(1);
	   console.log(xiaohanhan.a,dahanhan.a);
	   console.log(WangHan.prototype.a);

      //对于其中的原型里面的对于其中的基本类型来说在实例上进行修改其中的值之后不会将其中的原型的改变,但是对语气其中的引用类型来说改变其中一个实例里面的值对应的会将其中的原型中的进行改变

      //其中的查看的值来说现在实例上进行查找,找不到的时候再去原型上进行查找


      //原型的注意点:其中凡是从父亲那里继承的话,利用其中的hasOwnProtype的话,返回的将是false,那都不是自己的呦。除非你自己在实例上重新定义。对于其中的in操作符来说会将其中的实例和原型上的可以枚举的属性都会进行输出的。
      console.log(dahanhan.hasOwnProperty("name"));

      console.log("name" in  dahanhan);



      //其中还有比较简单的原型的语法利用其中的字面量的形式,利用其中的对象字面量的形式的,只不过这里需要注意的就是,其中的constructor不在指向其中的构造函数了,而是指向原型了。对象字面量里面其中利用一个大括号将其中的括起来了。所以说这里的constructor的话就是指向其中的object的。因为是对象字面量所以说我们这里在声明的时候就需要自己手动添加里面的constructor了,


      function Liy(){

      }
      //如果说其中的constructor真的很重要的话,我们可以像下面这样将其中的constructor给手动加上
      Liy.prototype={
      	constructor:Liy,
      	name:"liy",
      	age:20
      }

      let abc = new Liy();
      console.log(abc.name);


      //接下来是就是将其中的构造函数模块和原型进行组合使用,这里将其中的添加其中的属性(基本类型和引用类型)的话就利用的是其中的构造该函数的形式,对于其中方法的话利用的是原型,只不过我们在这里需要指出来的就是constructor


      //对于其中的动态原型(假如给里面添加一个方法吗,其中原型中存在的话,不在添加,反之),寄生构造函数(和工厂模式可以说一模一样,只是将其中的函数名字的首字母进行大写。应用就是给对象创建构造函数),稳妥构造函数(不用this,不用new,对应里面的属性只能用添加的方法来访问)来说
	</script>
</body>
</html>

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值