ES5_对象 与 继承
程序员文章站
2022-05-08 13:08:35
1. 对象的定义 注意: 原型链中声明属性将会多个实例共享,而构造函数不会 对象的继承 1. 对象的继承 之 对象冒充继承 注意: 对象冒充继承的方法 只能 继承对象的构造函数的属性和方法,不能 继承原型链中的函数和方法 2. 对象的继承 之 原型链继承 注意:原型链继承的方法 可以 继承对象的构造 ......
1. 对象的定义
//定义对象 function user(){ //在构造方法中定义属性 this.name = '张三'; this.age = 12; //在构造方法中定义方法: this.run = function(){ alert(this.name + '在跑步') } } //原型链中定义属性 user.prototype.sex = '男'; //原型链中定义方法 user.prototype.work = function(){ alert(this.name + '在工作') } // 静态方法的声明 user.getinfo = function () { alert('我是静态方法') } //对象的使用: 实例化对象 var user = new user('张三', 3); //属性的调用 alert('姓名:'+ user.name + '; 性别:' + user.sex); // 弹出: 姓名:张三; 性别:男 //给对象属性重新赋值 user.name = '李四'; user.sex = '女'; //方法的调用 user.run(); // 弹出:李四在跑步 user.work(); // 弹出:李四在工作 //静态方法的调用 user.getinfo(); // 弹出: 我是静态方法
注意: 原型链中声明属性将会多个实例共享,而构造函数不会
对象的继承
1. 对象的继承 之 对象冒充继承
function user(){ this.name = '张三'; //在构造方法中定义方法: this.run = function(){ alert(this.name + '在跑步') } } //原型链中定义属性 user.prototype.sex = '男'; //原型链中定义方法 user.prototype.work = function(){ alert(this.name + '在工作') } //对象中的继承一: 对象冒充继承 function student(){ //student 继承 user对象,此方法叫: 对象冒充继承 user.call(this); } var student = new student(); student.run(); // 弹出:张三在跑步 student.work(); //报错,原因是: 对象冒充继承的方法只继承对象的构造函数的属性和方法
注意: 对象冒充继承的方法 只能 继承对象的构造函数的属性和方法,不能 继承原型链中的函数和方法
2. 对象的继承 之 原型链继承
function user(){ this.name = '张三'; //在构造方法中定义方法: this.run = function(){ alert(this.name + '在跑步') } } //原型链中定义属性 user.prototype.sex = '男'; //原型链中定义方法 user.prototype.work = function(){ alert(this.name + '在工作') } //对象中的继承一: 原型链继承实现继承 function student(){ } student.prototype = new user(); var student = new student(); student.run(); // 弹出:张三在跑步 student.work(); // 弹出:张三在工作
注意:原型链继承的方法 可以 继承对象的构造函数的属性和方法,也可以 继承原型链中的函数和方法
function user(name){ this.name = name; //在构造方法中定义方法: this.run = function(){ alert(this.name + '在跑步') } } //原型链中定义属性 user.prototype.sex = '男'; //原型链中定义方法 user.prototype.work = function(){ alert(this.name + '在工作') } //带参数对象的实例化方法: var user1 = new user('张三'); user1.run(); // 弹出: 张三在跑步 user1.work(); // 弹出:张三在工作 //对象中的继承一: 原型链继承实现继承 function student(name){ } student.prototype = new user(); var student = new student('李四'); student.run(); // 弹出: undefined在跑步 student.work(); // 弹出:undefined在工作
注意:原型链继承有个缺点就是 在实例化子类时,无法 给父类传参,如上代码,子类调用父类的方法时, 弹出传参属性为 undefined
为了解决此缺点,则可以使用 冒充对象继承 + 原型链继承的组合模式
3. 冒充对象继承 + 原型链继承的组合模式
function user(name){ this.name = name; //在构造方法中定义方法: this.run = function(){ alert(this.name + '在跑步') } } //原型链中定义属性 user.prototype.sex = '男'; //原型链中定义方法 user.prototype.work = function(){ alert(this.name + '在工作') } //对象中的继承一: 原型链继承实现继承 function student(name){ //冒充对象继承时,可以给父类传参 user.call(this, name); } //原型链继承父类 //student.prototype = new user(); //因冒充对象继承时,已经继承了父类的构造函数中的属性和方法,因此在原型链继承中也可只继承父类的原型链的属性和方法,即 student.prototype = user.prototype; var student = new student('李四'); student.run(); // 弹出: 李四在跑步 student.work(); // 弹出:李四在工作
上一篇: Ajax的小贴士使用小结