网站建设设计目的,memcached wordpress,微信防红短链接生成,广东手机版建站系统开发Javascript是一种基于对象#xff08;object-based#xff09;的语言#xff0c;你遇到的所有东西几乎都是对象。但是#xff0c;它又不是一种真正的面向对象编程#xff08;OOP#xff09;语言#xff0c;因为它的语法中没有class#xff08;类#xff09;。 那么object-based的语言你遇到的所有东西几乎都是对象。但是它又不是一种真正的面向对象编程OOP语言因为它的语法中没有class类。 那么如果我们要把属性property和方法method封装成一个对象甚至要从原型对象生成一个实例对象我们应该怎么做呢 一、 生成对象的原始模式 假定我们把猫看成一个对象它有名字和颜色两个属性。 var Cat { name : , color : } 现在我们需要根据这个原型对象的规格schema生成两个实例对象。 var cat1 {}; // 创建一个空对象 cat1.name 大毛; // 按照原型对象的属性赋值 cat1.color 黄色; var cat2 {}; cat2.name 二毛; cat2.color 黑色; 好了这就是最简单的封装了把两个属性封装在一个对象里面。但是这样的写法有两个缺点一是如果多生成几个实例写起来就非常麻烦二是实例与原型之间没有任何办法可以看出有什么联系。 二、 原始模式的改进 我们可以写一个函数解决代码重复的问题。 function Cat(name,color){ return { name:name, color:color } } 然后生成实例对象就等于是在调用函数 var cat1 Cat(大毛,黄色); var cat2 Cat(二毛,黑色); 这种方法的问题依然是cat1和cat2之间没有内在的联系不能反映出它们是同一个原型对象的实例。 三、 构造函数模式 为了解决从原型对象生成实例的问题Javascript提供了一个构造函数Constructor模式。 所谓构造函数其实就是一个普通函数但是内部使用了this变量。对构造函数使用new运算符就能生成实例并且this变量会绑定在实例对象上。 比如猫的原型对象现在可以这样写 function Cat(name,color){ this.namename; this.colorcolor; } 我们现在就可以生成实例对象了。 var cat1 new Cat(大毛,黄色); var cat2 new Cat(二毛,黑色); alert(cat1.name); // 大毛 alert(cat1.color); // 黄色 这时cat1和cat2会自动含有一个constructor属性指向它们的构造函数。 alert(cat1.constructor Cat); //true alert(cat2.constructor Cat); //true Javascript还提供了一个instanceof运算符验证原型对象与实例对象之间的关系。 alert(cat1 instanceof Cat); //true alert(cat2 instanceof Cat); //true 四、构造函数模式的问题 构造函数方法很好用但是存在一个浪费内存的问题。 请看我们现在为Cat对象添加一个不变的属性type种类再添加一个方法eat吃老鼠。那么原型对象Cat就变成了下面这样 function Cat(name,color){ this.name name; this.color color; this.type 猫科动物; this.eat function(){alert(吃老鼠);}; } 还是采用同样的方法生成实例 var cat1 new Cat(大毛,黄色); var cat2 new Cat (二毛,黑色); alert(cat1.type); // 猫科动物 cat1.eat(); // 吃老鼠 表面上好像没什么问题但是实际上这样做有一个很大的弊端。那就是对于每一个实例对象type属性和eat()方法都是一模一样的内容每一次生成一个实例都必须为重复的内容多占用一些内存。这样既不环保也缺乏效率。 alert(cat1.eat cat2.eat); //false 能不能让type属性和eat()方法在内存中只生成一次然后所有实例都指向那个内存地址呢回答是可以的。 五、 Prototype模式 Javascript规定每一个构造函数都有一个prototype属性指向另一个对象。这个对象的所有属性和方法都会被构造函数的实例继承。 这意味着我们可以把那些不变的属性和方法直接定义在prototype对象上。 function Cat(name,color){ this.name name; this.color color; } Cat.prototype.type 猫科动物; Cat.prototype.eat function(){alert(吃老鼠)}; 然后生成实例。 var cat1 new Cat(大毛,黄色); var cat2 new Cat(二毛,黑色); alert(cat1.type); // 猫科动物 cat1.eat(); // 吃老鼠 这时所有实例的type属性和eat()方法其实都是同一个内存地址指向prototype对象因此就提高了运行效率。 alert(cat1.eat cat2.eat); //true 六、 Prototype模式的验证方法 为了配合prototype属性Javascript定义了一些辅助方法帮助我们使用它。 6.1 isPrototypeOf() 这个方法用来判断某个proptotype对象和某个实例之间的关系。 alert(Cat.prototype.isPrototypeOf(cat1)); //true alert(Cat.prototype.isPrototypeOf(cat2)); //true 6.2 hasOwnProperty() 每个实例对象都有一个hasOwnProperty()方法用来判断某一个属性到底是本地属性还是继承自prototype对象的属性。 alert(cat1.hasOwnProperty(name)); // true alert(cat1.hasOwnProperty(type)); // false 6.3 in运算符 in运算符可以用来判断某个实例是否含有某个属性不管是不是本地属性。 alert(name in cat1); // true alert(type in cat1); // true in运算符还可以用来遍历某个对象的所有属性。 for(var prop in cat1) { alert(cat1[prop]cat1[prop]); } 转载于:https://www.cnblogs.com/mingjixiaohui/p/5503012.html
