js 面向对象 定义对象
js面向对象看了很多,却没有完全真正的理解,总是停留在一定的阶段,这次再认真看一下。
面向对象包含两种:定义类或对象;继承机制;都是通过工厂模式,构造函数,原型链,混合方法这四个阶段,原理也一样,只是实现细节有点不同
定义类或对象教程:http://www.w3school.com.cn/js/pro_js_object_defining.asp
思路:工厂模式--构造函数--原型链--混合方式,注意每个阶段的具体写法和不足
工厂模式(四个阶段):原始--工厂--传参--共享方法;方法名小写;不用new执行;
原始:
var oCar = new Object;
oCar.color = "blue";
oCar.doors = 4;
oCar.mpg = 25;
oCar.showColor = function() {
alert(this.color);
};
缺点:如果创建多个对象,就要写很多遍相同的代码
工厂:把通用的代码放在一个函数中;函数内,创建一个对象,return一个对象
function createCar() {
var oTempCar = new Object;
oTempCar.color = "blue";
oTempCar.doors = 4;
oTempCar.mpg = 25;
oTempCar.showColor = function() {
alert(this.color);
};
return oTempCar;
}
var oCar1 = createCar();
var oCar2 = createCar();
缺点:生成的对象,属性方法完全一样
传参:给属性传递不同的参数;生成的对象,有相同的属性名,不同的属性值;
function createCar(sColor,iDoors,iMpg) {
var oTempCar = new Object;
oTempCar.color = sColor;
oTempCar.doors = iDoors;
oTempCar.mpg = iMpg;
oTempCar.showColor = function() {
alert(this.color);
};
return oTempCar;
}
var oCar1 = createCar("red",4,23);
var oCar2 = createCar("blue",3,25);
oCar1.showColor(); //输出 "red"
oCar2.showColor(); //输出 "blue"
缺点:生成的对象,有各自的方法,浪费内容
共享方法:在工厂函数外定义自己的方法,再通过属性指向
function showColor() {
alert(this.color);
}
function createCar(sColor,iDoors,iMpg) {
var oTempCar = new Object;
oTempCar.color = sColor;
oTempCar.doors = iDoors;
oTempCar.mpg = iMpg;
oTempCar.showColor = showColor;
return oTempCar;
}
var oCar1 = createCar("red",4,23);
var oCar2 = createCar("blue",3,25);
oCar1.showColor(); //输出 "red"
oCar2.showColor(); //输出 "blue"
缺点:语义上看不像对象的方法
构造函数:工厂模式的四个阶段,可以通过构造函数共同解决;方法名首字母大写;没有创建对象,使用this;new执行;没有return;
function Car(sColor,iDoors,iMpg) {
this.color = sColor;
this.doors = iDoors;
this.mpg = iMpg;
this.showColor = function() {
alert(this.color);
};
}
var oCar1 = new Car("red",4,23);
var oCar2 = new Car("blue",3,25);
共享方法的问题,跟工厂模式的一样。
原型链:用空构造函数来设置类名。然后所有的属性和方法都被直接赋予 prototype 属性
function Car() {
}
Car.prototype.color = "blue";
Car.prototype.doors = 4;
Car.prototype.mpg = 25;
Car.prototype.drivers = new Array("Mike","John");
Car.prototype.showColor = function() {
alert(this.color);
};
var oCar1 = new Car();
var oCar2 = new Car();
oCar1.drivers.push("Bill");
alert(oCar1.drivers); //输出 "Mike,John,Bill"
alert(oCar2.drivers); //输出 "Mike,John,Bill"
缺点:
1、构造函数没有参数,这个问题,可能原型链就是这样定义的吧。
2、如果属性(driver)指向对象,多个实例对指向同一个对象,出现问题。
目的:属性不能共享(如果需要共享的话,写在prototype上),方法需要共享;
混合方式:
function Car(sColor,iDoors,iMpg) {
this.color = sColor;
this.doors = iDoors;
this.mpg = iMpg;
this.drivers = new Array("Mike","John");
}
Car.prototype.showColor = function() {
alert(this.color);
};
var oCar1 = new Car("red",4,23);
var oCar2 = new Car("blue",3,25);
oCar1.drivers.push("Bill");
alert(oCar1.drivers); //输出 "Mike,John,Bill"
alert(oCar2.drivers); //输出 "Mike,John"
现在:属性在构造函数创建,方法在原型链上创建。
js 面向对象 定义对象的更多相关文章
- JavaScript学习12 JS中定义对象的几种方式【转】
avaScript学习12 JS中定义对象的几种方式 转自: http://www.cnblogs.com/mengdd/p/3697255.html JavaScript中没有类的概念,只有对象. ...
- JavaScript学习12 JS中定义对象的几种方式
JavaScript学习12 JS中定义对象的几种方式 JavaScript中没有类的概念,只有对象. 在JavaScript中定义对象可以采用以下几种方式: 1.基于已有对象扩充其属性和方法 2.工 ...
- JS中定义对象和集合
在js中定义对象: 方式一: var obj = {}; obj['a']=1; obj['b']=2; 方式二: var obj=new Object(); obj.a=1; obj.b=2; 在j ...
- js面向对象学习 - 对象概念及创建对象
原文地址:js面向对象学习笔记 一.对象概念 对象是什么?对象是“无序属性的集合,其属性可以包括基本值,对象或者函数”.也就是一组名值对的无序集合. 对象的特性(不可直接访问),也就是属性包含两种,数 ...
- js面向对象(对象/类/工厂模式/构造函数/公有和原型)
https://www.cnblogs.com/sandraryan/ 什么是对象 js中一切都是对象(有行为和特征).js允许自定义对象,也提供了内建对象(string date math等) 对象 ...
- js中定义对象的几种方式
转载:http://blog.sina.com.cn/s/blog_60f632050100wz7h.html (1)基于已有对象的扩充方法:适用于临时构建对象,弊端:每次构建对象都要新建一个. va ...
- js中定义对象的方式有哪些?
1.对象直接量 2.构造函数 3.原型方法 4.动态原型方法
- 原型设计模式prototype-构造js自己定义对象
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- JS中定义对象原型的两种使用方法
第一种: function Person() { this.username = new Array(); this.password = "123"; } Person.prot ...
随机推荐
- SQL Server:查看数据库用户权限(SQL 2005)
1. 查看 SQL 2005 用户所属数据库角色 use yourdb go select DbRole = g.name, MemberName = u.name, MemberSID = u.si ...
- 吴裕雄 python神经网络 水果图片识别(2)
import osimport numpy as npimport matplotlib.pyplot as pltfrom skimage import color,data,transform,i ...
- 类的"魔法"方法
1. __init__()方法 <1>使用方式 def 类名: #初始化函数,用来完成一些默认的设定 def __init__(): pass 总结1 当创建Car对象后,在没有调用__i ...
- Linux就业技术指导(七):游戏类运维重点流程解析
一,某游戏公司例行上线与更新流程示例 例行维护/更新流程 1.1 更新前天 提前确认好要更新的是什么,更新会有人通知你,一般是运营人员 比如:我们明天做什么什么更新 1.2 第2天更新 一般固定点更新 ...
- gff/gtf格式
1)gff3及gtf2简介 一个物种的基因组测序完成后,需要对这些数据进行解读,首先要先找到这些序列中转录起始位点.基因.外显子.内含子等组成元件在染色体中的位置信息(即注释)后才能再进行深入的分析. ...
- Java对称与非对称加密解密,AES与RSA
加密技术可以分为对称与非对称两种. 对称加密,解密,即加密与解密用的是同一把秘钥,常用的对称加密技术有DES,AES等 而非对称技术,加密与解密用的是不同的秘钥,常用的非对称加密技术有RSA等 为什么 ...
- 等待时间,time.sleep()和implicitly_wait()
在运行一个以前执行的过的功能时,报错了,不能执行了. 功能描述:通过导航,选择下拉项(发布职位功能),下面是审查的元素: 获取元素的代码: 尝试了用xpath去获取:driver.find_eleme ...
- input disable手机端颜色兼容问题
color: #5b636d; -webkit-text-fill-color: #5b636d; opacity: 1; -webkit-opacity: 1; input在移动端会有padding ...
- configparser模块 logging模块
configparser模块 固定格式的配置文件 有一个对应的模块去帮你做这个文件的字符串处理 config = configparser.Configparser() config.read(“ex ...
- 【校招面试 之 剑指offer】第11题 旋转数组中的最小数字
题目:把一个数组最开始的若干个元素搬到数组的末尾,我们称之为数组的旋转.输入一个递增排序的数组的一个旋转,输出旋转数组的最小元素.例如: 数组{3,4,5,1,2}为{1,2,3,4,5}的一个旋转, ...