31面向对象编程-补充.md · MINT/JavaScript笔记

## 第三十一章.面向对象编程-补充

- **封装性**

```js
//工厂模式
    function student(name,id){
      let obj = {};

obj.name = name;
      obj.id = id;
      obj.company = "外经贸";
      obj.say = function(){
        console.log(`我是${this.name}，学号：${this.id}`);
      };

return obj;
    }

let pika = student("皮卡","224");
    let ayuan = student("阿远","221");
    let weige = student("伟哥","209");

console.log(pika);
    console.log(ayuan);
    console.log(weige);

pika.say();
    ayuan.say();
    weige.say();
```

```js
/*
    * new关键词
    *
    *   new关键词后面要跟上一个函数
    *
    * ? 函数执行之前加new对这个函数有影响呢？
    *   - 函数内部的this指向会改变（ 函数内部自动创建一个全新的对象，this指向这个对象 ）
    *   - 函数默认返回这个对象
    *
    *   这个函数称之为 构造函数
    *
    *
    * new Date()
    * new Object()
    * new Array()
    * new RegExp()
    * new XMLHTTPRequest()
    * new Promise()
    * new Image()
    *
    *
    * */

function goudan(){
      this.x = 10;
      this.y = 20;
    }

// console.log(goudan());
    console.log(new goudan());
    console.log(new goudan());
    console.log(new goudan());
    console.log(new goudan());
    console.log(new goudan());
```

```js
	//构造函数 -- 约定：所有构造函数首字母大写
    function Student(name,id){
      this.name = name;
      this.id = id;
      this.university = "外交贸";
      this.say = function(){
        console.log(`我是${this.name}，学号：${this.id}`);
      };
    }

//实例化
    let pika = new Student("皮卡","224"); //实例
    let ayuan = new Student("阿远","221"); //实例
    let weige = new Student("伟哥","209"); //实例

console.log(pika);
    console.log(ayuan);
    console.log(weige);
    pika.say();
    ayuan.say();
    weige.say();
```

- **prototype原型**

```js
console.log(pika === ayuan);//fasle
console.log(pika.say === ayuan.say);//true
```

-  **proto 原型链**

```js
function Fn(){
      this.x = 10;
    }
    Fn.prototype   .x = 20;

// console.log(Fn.prototype);

let a = new Fn();

console.log(a.__proto__ === Fn.prototype);
```

- **继承性**

```js
 /*
    * 继承：
    *   儿子继承爸爸，
    *   爸爸有的儿子都要有，
    *   爸爸没有的儿子可以新增，
    *   但是儿子的新增不能改变爸爸的任何东西
    *
    * */

function Person(name,age){
      this.name = name;
      this.age = age;
    }
    Person.prototype.say = function(){
      console.log(this.name+":"+this.age);
    };

//想基于Person创建出一个Teacher类
    function Teacher(name,age,id){
      //私有属性的继承 call它
      Person.call(this,name,age);

//私有属性的新增
      this.id = id;
    }
    //原型的继承
    // Teacher.prototype = Person.prototype; //建立了引用，行不通
    Teacher.prototype = new Person();
    //原型的新增
    Teacher.prototype.university = "外经贸";

let a = new Person("小A",18);
    console.log(a);//Person{age：18，name："小A"}

let b = new Teacher("简老师",20,"201801624");
    console.log(b);//Teacher{age：20，id："201801624",name:"简老师"}

a.say();//小A:18
    b.say();//简老师:20
```

```js
//通过constructor来写继承
function F(){}
    F.prototype = Person.prototype;
    Teacher.prototype = new F();
    //修复一下constructor
    Teacher.prototype.constructor = Teacher;
    //原型的新增
    Teacher.prototype.univerity = "外经贸";

let a = new Person("小A",18);
    console.log(a);//Person{age：18，name："小A"}

let b = new Teacher("简老师",20,"201801624");
    console.log(b);//Teacher{age：20，id："201801624",name:"简老师"}

a.say();//小A:18
    b.say();//简老师:20
```

- **class**

```js
/*
    * ES6 的 构造函数
    * */

//定义构造函数
    class Person{
      //私有属性
      constructor(n,a) {
        this.name = n;
        this.age = a;
      }

//公共属性 -- 只允许函数充当公共属性
      say(){
        console.log(this.name,this.age);
      }
    }

//继承 利用关键字 extends   感觉就像是Java啊哈哈哈~
    class Teacher extends Person{
      constructor(n,a,id) {
         //super 关键字 
        //继承之后，一定要在这里执行super()，这样才能继承原来的私有属性
        super(n,a);

//私有属性的新增
        this.id = id;
      }

//原型默认就已经继承了，我们只需要继续写原型的新增就可以
      company(){
        return "潭州教育";
      }
    }

let a = new Person("小A",18);
    console.log(a);//Person{age：18，name："小A"}

let b = new Teacher("简老师",20,"201801624");
    console.log(b);//Teacher{age：20，id："201801624",name:"简老师"}

a.say();//小A:18
    b.say();//简老师:20
```

MINT/JavaScript笔记

简介

发行版

贡献者

近期动态