JS面向对象的几种书写模式
2018-03-15 17:23
288 查看
工厂模式
//使用工厂模式 即封装创建函数 达到复用功能 避免代码重复 function createPerson () { var o = new Object(); o.name="cav"; o.sayname=function(){ alert("cevq"); } return o; }构造函数模式
/*构造函数模式 构造函数可以当作函数来用 任何函数只要通过new来调用就可以作为一个构造函数 作为普通函数来用的话 属性和方法都添加给windows了(因为此时的this就是windows)*/ function Person (name,age) { this.name=name; this.age=age; this.sayname=sayname;//此种方法可以解决创建多个对象时函数多次创建问题 即该函数是被person对象共享的 但是不推荐这么做 } function sayname () { alert("vewvew"); } var person1=new Person("cav","vave");//需要使用new 用instanceof来判断对象类型
*原型模式使用原型模式(prototype 每个函数都有) :prototype是一个指针,指向原型对象,原型对象会有一个constructor属性(构造函数) 可将实例共享的方法或则属性包含到这里面,constructor指向本来创建的函数,每一个对象内部都有一个指针指向原型。
function Person () { } Person.prototype.name="vewvew"; Person.prototype.age="ewve"; Person.prototype.sayname=function () { alert(this.name); } var person1=new Person(); var person2=new Person(); alert(person1.name==person2.name)//true常用方法和注意事项[[Prototype]]指针:每个实例内部都有一个指向构造函数的原型的指针
isPrototypeOf():确定对象的[[Prototype]]指针是否指向原型对象
Object.getPrototypeOf():返回对象的[[Prototype]]指针指向的原型对象的prototype的值
读取对象属性或者方法的顺序:先在本对象中找 ,如果找不到 ,就"沿着该对象的[[Prototype]]指针指向的原型"去找。
delete 对象.属性
hasOwnProperty():检测一个属性是存在实例中还是存在原型中 在实例中时返回true 对象.hasOwnProperty(属性)
in:当通过对象能够访问属性时 返回true 语法: 属性 in 对象
for in 循环屏蔽了对象中不可枚举的属性 既包括存在实例中的属性也包括存在原型中的属性
Object.keys():参数是对象 返回一个该对象中所有的可枚举的实例属性
Object.getOwnPropertyNames():参数是对象 返回对象中所有属性 无论是否可以枚举
*更简单的原型模式语法
var person ={}; person.prototype={ constructor:person,//因为用字面量方式返回的是一个新的对象,所以新建的对象(花括号里面的)的constructor不再指向person 需要手动指定 name:"cewvew", age:41, sayname:function () { } };
//即使先创建对象 后在原型上修改 也能在对象上立即反应出来 但是不能全部重写原型对象 如果完全重写原型对象就切断了实例的[[Prototype]]指针和原型对象之间的关系 function Person () { } var person = new Person();//此时person的[[Prototype]]指向Person最初的原型对象 Person.prototype={//此时Person的原型对象被赋予了一个新的原型对象地址 因此上面的person的原型指针就不再指向Person的原型 name:"vewvewv" } person.name;//此时访问不了组合使用构造函数和原型模式
//即在可以像构造函数里面传参 初始化对象的属性 然后调用原型重写的方式 function person (num1,num2) { this.name=num1; this.age=num2; this.sayname=function(){ return this.name; } } person.prototype={ constructor:person, city:"vewv" }
动态原型模式
//即在构造函数里加入判断条件 避免原型初始化之后相应属性重复初始化 if(typeof this.sayname!="function"){ person.prototype.sayname=function() { alert("Cewvew"); } }
相关文章推荐
- JS面向对象的几种创建方式:工厂模式、构造函数模式、原型模式、混合模式、动态原型模式
- JS面向对象几种模式的理解
- js面向对象之常见创建对象的几种方式(工厂模式、构造函数模式、原型模式)
- js面向对象之常见创建对象的几种方式(工厂模式、构造函数模式、原型模式)
- [js高手之路]面向对象+设计模式+继承一步步改造简单的四则运算
- js中面向对象(创建对象的几种方式)
- js面向对象的几种常见写法
- 关于面向对象的几种模式和个人理解
- 几种js设计模式的理解
- js 面向对象的几种方式
- 归纳下js面向对象的几种常见写法
- 面向对象js--原型模式实例解析
- javascript面向对象——几种常见的设计模式
- 归纳下js面向对象的几种常见写法总结
- 归纳下js面向对象的几种常见写法
- JS面向对象二:js对象的几种创建方式
- js面向对象的几种方式。
- js设计模式学习之面向对象的javascript(三)--原型式继承
- js 的几种面向对象的方式
- 面向对象JS基础讲解,工厂模式、构造函数模式、原型模式、混合模式、动态原型模式