JavaScript中的的面向对象中的一些知识

function Cat(name,age){return {name:name,age:age   }}//构造函数function Dog(name,age){this.name=name;this.age=age;    }function show(){var c1=new Cat("cat1",18);var c2=new Cat("cat2",19);//Javascript还提供了一个instanceof运算符,验证原型对象与实例对象之间的关系。alert(c1 instanceof Cat); //falsealert(c2 instanceof Cat); //falsevar d1=new Dog("dog1",18);var d2=new Dog("dog2",19);alert(d1 instanceof Dog);  //truealert(d2 instanceof Dog);  //true
       }

构造函数方法很好用,但是存在一个浪费内存的问题。

所以就有了prototype对象了

    function Dog(name,age){this.name=name;this.age=age;    }Dog.prototype.type="Animal";//isPrototypeOf();某个prototype对象和某个实例之间的关系function show(){var dog=new Dog("yuanzhangliu",18);//alert(Dog.prototype.isPrototypeOf(dog));//true;//判断对象的实例时属于本地还是prototype对象的属性alert(dog.hasOwnProperty("name")); //truealert(dog.hasOwnProperty("type")); //false//那么我们的in运算符号可以判断,某个实例是否含有属性;不管本地还是prototype中滴alert("name" in dog); //truealert("type" in dog); //true//或者直接使用我们for循环来遍历滴呀for(var prop in dog){alert(prop);    }}

第二部分:构造函数之间的继承

call apply 实现继承

  function Animal(){this.species="Animal";  this.fun=function (){alert("eat");  }}function Dog(name,age){this.name=name;this.age=age;Animal.call(this);//Animal.call(this,arguments); 将Dog中的参数传递过去,//让它(arguments)中可以使用滴呀 具体的额,后面用到再呵呵呵
  }function show(){var d=new Dog("dog",12);alert(d.species);d.fun();}

prototype来是实现滴呀

  function Animal(){this.species="Animal";  this.fun=function (){alert("eat");  }}function Dog(name,age){this.name=name;this.age=age;}function show(){//第一步:Dog.prototype=new Animal();Dog.prototype.constructor=Dog; //这不还是很重要的//防止继承链的紊乱//再实际的开发中如果我们替换了原来函数对象的prototype//我们也该constructor,(正确的说叫还原constructor)//o.prototype={};//o.prototype.consturtor=ovar d=new Dog("yuanzhang.liu",18);d.fun();}

方法三

  function AnimalOld(){this.species="Animal";  this.fun=function (){alert("eat");  }}//将他改造成如下:function Animal(){}Animal.prototype.species="Animal";Animal.prototype.fun=function (){alert("eat");  }function Dog(name,age){this.name=name;this.age=age;}function show011(){//这样我们就省去了new Animal();Dog.prototype=Animal.prototype;Dog.prototype.constructor=Dog; //这句话也将我们Animal.prototype.constructor 改变了滴呀//解决方法就是利用空的对象做为介质滴呀var d=new Dog("yuanzhangliu",18);d.fun(); //这样我们的额Dog.prototype 和 Animal.prototype 就指向了同一个//对象,任何一个对象的修改,都会反映到另外一个对象上滴呀
  }function F(){}function show(){F.prototype=Animal.prototype;Dog.prototype=new F();Dog.prototype.constructor=Dog;var d=new Dog("yuanzhangliu",18);d.fun(); //这样我们的额Dog.prototype 和 Animal.prototype 就指向了同一个//对象,任何一个对象的修改,都会反映到另外一个对象上滴呀}

我们把上面的的方法总结和改进一下就可以提取出一个通用的方法滴呀

 function extend(Child,Parent){function Kong(){};Kong.prototype=Parent.prototype;Kong.prototype.constructor=Kong;Child.prototype=new Kong();Child.prototype.constructor=Child;}

方式四:我们可以通过拷贝的方式进行滴呀;

function Person(name,age){this.name=name;this.age=age;this.fun=function (){alert("fun"); }}Person.prototype.protoFun=function (){alert("prototypeInfo"); }function Dog(name,age){this.name=name;this.age=age;}//接下来,我们通过拷贝来实现继承id呀function extend2(Child,Parent){//同样的,使用这种方式实现继承滴呀;//父类的属性,必须设置在prototype上才被子类继承var p=Parent.prototype;var c=Child.prototype;for(var i in p){c[i]=p[i];//还要拷贝它的值滴呀;
    }}function show(){extend2(Dog,Animal);var d=new Dog("yuanzhangliu",18);d.protoFun();d.fun();//无法调用滴呀   }

非构造函数的方式来实现继承继承滴呀

   //非构造函数的方式实现继承滴呀;var chinese={nation:'中国'};var Doctor={career:'医生'}//这两个都是普通的对象,不是构造函数,无法使用构造函数的方式来实现继承滴呀//将两个对象通过prototype链,连接在一在一起的呀;

实现方式

 function object(parent){function F(){//利用它的原型链,将他们连接在一起的滴呀
       }F.prototype=parent;var son=new F();return son;//这样就返回了父级对象滴呀
    }//使用的时候;var Chinese={nation:'中国'    }var Doctor=object(Chinese);Doctor.career='医生';alert(Doctor.nation);//原来尼玛,是这样写的滴呀;

还用一种方式:

    function extendCopy(parent){var c={}; //空对象介质;for(var i in parent){//循环遍历出它的属性的呀; 子对象获取的是父对象的一个内存地址c[i]=parent[i];   }return c;}//使用的时候;var Chinese={nation:'中国'    }var Doctor=extendCopy(Chinese);Doctor.career='医生';alert(Doctor.nation);

缺点:浅拷贝,子对象获取的是父对象的一个内存地址,当子对象改变的同时也就改变了父级对象滴呀

Chinese.birthPlaces=['日本','京都','大阪'];var Doctor=extendCopy(Chinese);Doctor.birthPlaces.push('眉山');alert(Chinese.birthPlaces);//父级的也被改变了
    alert(Doctor.birthPlaces);//他们的结果都是:'日本','京都','大阪','眉山'

既然有浅拷贝,当然就有我们的深拷滴呀

     function deepCopy(parent,son){var son=son || {};for(var i in parent){if(typeof parent[i]==='object'){son[i]=(parent[i].constructor===Array)?[]:{};//然后继续拷贝滴呀deepCopy(parent[i],son[i]);//进一步的遍历滴呀}else{son[i]=parent[i];    }}}//目前jquery 就使用的这种方式实现继承id呀

这样我们的面向对象的就算是....

转载于:https://www.cnblogs.com/mc67/p/5182247.html

JavaScript中的的面向对象中的一些知识相关推荐

  1. JavaScript中OOP——面向对象中的继承/闭包

      前  言  OOP  JavaScript中OOP-->>>面向对象中的继承/闭包 1.1面向对象的概念 使用一个子类继承另一个父类,子类可以自动拥有父类的属性和方法.      ...

  2. php 静态类内存,php面向对象中static静态属性与方法的内存位置分析

    本文实例分析了php面向对象中static静态属性与方法的内存位置.分享给大家供大家参考.具体如下: static静态属性的内存位置-->类,而不是对象.下面做测试来证明一下 header(&q ...

  3. 如何从JavaScript中的给定数字中形成最小的数字

    by Prashant Yadav 通过Prashant Yadav 如何从JavaScript中的给定数字中形成最小的数字 (How to form the smallest possible nu ...

  4. python中如何创建类的对象_python面向对象中如何建立具体的对象?

    我们现在眼前所能看到的事物,都是具体的对象.很多小伙伴在面向对象中创建对象,其实都停留在对象名称的建立,计算机中并没有具体对象的描述属性.我们想要使用python中的类,建立的对象就需要是具体的.下面 ...

  5. c++中把一个函数中的语句复制到另一个语句中报错_从底层看前端(十一)—— JavaScript语法:脚本,模块和函数体。...

    这篇文章我们继续聊JavaScript语法. 在讲解具体的语法结构之前,先看看语法的一些基本规则. 脚本和模块 首先,JavaScript有两种源文件,一种叫脚本(script),一种叫做模块(mod ...

  6. Python面向对象中反射和双下的正确用法

    一.反射 反射:程序可以访问,检测和修改它本身状态或行为的一种能力(自省) python面向对象中的反射:通过字符串的形式操作对象相关的属性 python中的一切事物都是对象(都可以使用反射) 四个可 ...

  7. 图解面向对象中的聚合与耦合概念

    图解面向对象中的聚合与耦合概念 简单理解聚合与耦合 在面向对象的设计中,我们经常会听到或用到聚合.耦合的概念.面向对象的目标就是设计出高聚合.低耦合的程序.然而,究竟什么是 聚合.什么是耦合,恐怕每个 ...

  8. javascript按字节截取标题中字符串

    javascript按字节截取标题中字符串 在网页展示中经常会碰到,标题过长,需要截取字符串,用CSS的实现的话各种兼容问题,下面为大家介绍下javascript如何按字节截取字符串 做为一个前端开发 ...

  9. 【JavaScript】如何将JS中的数据提交到Servlet服务器中

    功能 用户可以在form表单中输入用户名和密码 点击"改变用户名"."改变密码"."改变隐藏值"按钮后,相应input中的值被改变 注意:此 ...

最新文章

  1. 中科创星米磊:从五个方向筛选“硬科技”企业
  2. 图灵机器人api接入c语言,apikey创建接入图灵机器人
  3. 计算机组成原理验证JRNS,计算机组成原理(上)第4章 测试(中)
  4. 使用Advanced Installer进行二次打包
  5. MongoDB sharding模式实现(http://blog.chinaunix.net/xmlrpc.php?r=blog/articleuid=28266791id=5758139 )
  6. 大数据WEB阶段(四)JavaScript
  7. UVA 10334 Ray Through Glasses
  8. Chrome渲染Transition时页面闪动Bug
  9. pascal行人voc_Pascal Voc数据集详细分析
  10. C++析构函数定义和使用
  11. xpath helper
  12. getActivePinia was called with no active Pinia. Did you forget to install pinia?
  13. linux iptables实现单机多ip出口ip负载均衡(宽带叠加)
  14. 项目报找不到属性时解决方法
  15. TPS62240DDCR同步降压DC-DC转换器
  16. 新浪微博粉丝通推广效果分析
  17. C/C++代码缺陷静态检查工具cppcheck
  18. 山东农商行真题计算机类,2019山东农商行招聘考试计算机题库(十六)
  19. vue-cli创建vue2或vue3新项目步骤【留底收藏】
  20. 毕业论文格式排版word

热门文章

  1. ios 阅览器html5,HTML5测试:iOS 8浏览器Safari提升明显
  2. search engine php,用php简单实现search engine friendly的url_php技巧
  3. matlab序列谱分析,基于MATLAB序列谱分析及FFT实现快速卷积.pdf
  4. Qt 多线程并发高阶类QtConcurrent 的使用
  5. discuz邮件设置PHP,Discuz!6.0—如何配置发送邮件的参数
  6. 面试:整理面试中常被问到的8种数据结构
  7. Web安全的三个攻防姿势
  8. c语言一元二次方程 ii(分支嵌套),C程序设计——求一元二次方程算法
  9. java hibernate的使用_《Hibernate快速开始 – 4 – 使用JAVA持久层 API (JPA)教程》
  10. 陌生人社会_陌生人之旅