欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

面向对象的封装、继承、多态以及构造函数

程序员文章站 2022-06-16 23:48:59
1、面向对象特点:封装、继承、多态。2、构造函数 = 构造器 + 原型对象;(1)父类function UserClass(name,age,word){ //构造器 constructor this.name=name; this.age =age; this.word =word; this.i ......

1、面向对象特点:封装、继承、多态。
2、构造函数 = 构造器 + 原型对象;
(1)父类
function userclass(name,age,word){
  //构造器 constructor
  this.name=name;
  this.age =age;
  this.word =word;
  this.init =function(){
    return `${this.name} ----init初始化`;
  }
}
userclass.prototype={
  //原型对象 prototype 只能实例化之后才能调取
  say(){
    return `${this.name}---${this.age}----${this.word}`;
  }
}
module.exports = userclass;

var u1 = new userclass("大雷",18,"你们这些二*");
打印:你们这些二* -- 大雷 -- init初始化

(2)子类
继承父类:call/apply 改变this指向来实现继承,两者参数不相同,功能相同。但无法继承原型对象。
var userclass=require("./userclass");
function user(name,age,word,grade){
  this.grade=grade;
  //userclass.call(this,name,age,word);
  userclass.apply(this,[name,age,word]);
}

//(1)直接赋值:可以继承原型对象
//user.prototype = new userclass();
//(2)对象复制:可以继承原型对象
//for(var i in userclass.prototype){
// user.prototype[i] = userclass.prototype[i];
// }

user.prototype={
  say(){ //把父类的say方法改写叫方法重载。
    return `${this.name} 说:我好累`;
},
  walk(){ //添加属于自己的方法叫多态。
    return "i am fly";
  }
}
module.exports = user;

var u2 = new user("小明",22,"不存在的啊",100);


补充知识点:
var person = {
  username: "人类",
  say: function () {
    alert(this.username + "你好");
  }
}

var yellowperson = {
  __proto__: person,
  username: "黄种人",
};
(1)object.prototype.username = "地球人";//可以使用大写的object来实现继承
(2)yellowperson.constructor.prototype === object.prototype 结果为true
注意:yellowperson.prototype.username = "地球人"; 普通对象不能使用原型来继承
打印: yellowperson.say();

普通函数的继承call和apply:
<script>
window.username = "lili";
var person = {
  username: "leson"
  function say(userage,hobby) {
  alert(this.username + "今年" + userage + "岁喜欢"+hobby);
}

say.call(person, 18,"篮球");//say里面的this 指向call里面的第一个参数
</script>

<script>
window.username = "lili";
var person = {
  username: "leson"
}
function say(userage,hobby) {
  alert(this.username + "今年"+userage+"岁喜欢"+hobby);
}
say.apply(person,[18,"篮球"]);//say里面的this 指向apply里面的第一个参数
</script>

三种继承方式:
构造函数 使用原型
普通对象 使用内部原型
普通函数 使用call/apply

构造函数:使用的时候用new关键字实例化的函数
1、构造函数就是一个类(object) 可以有属性和方法 里面的this就指向该构造函数
2、构造函数可以通过prototype来实现继承(补充自身扩展更多内容)
3、继承的时候就会产生原型链 自身-原型-object object没有就是undefined object就是原型链的末端

this的指向问题:函数属于谁就指向谁
1 window 当函数直接调用的时候 函数名前面什么都没有的时候 say();
2 object 指向函数的所有者 btn.onclick = function(){ }
3 构造函数 new say() this就指向构造函数
4 call/apply里面的第一个参数