面向对象编程

_今晚打老虎
135 阅读4分钟

面向对象编程思想

  • 面向对象编程

找具有解决问题功能的对象，调用其功能，完成任务。如果对象不存在，则创建对象。

  • 面向过程编程

解决问题的过程，按步骤进行，第一步做什么,第二步做什么，一步一步完成

创建对象方式

1.简单方式new Object

//简单方式-创建对象
let personObj = new Object();
//对象属性
personObj.name = "小明";
personobj.age = 3;
//对象方法
personObj-playGame = function() {
    console.log('玩游戏');
}

personobj-playGame();

2.字面量方式

//字面量方式let person1 = {
    name: '小明',
    age: 18,
    playGame: function () {
        console.log('玩游戏>>>');
    }
}

person1-playGame();

3.工厂函数

//简单方式的改进:工厂函数
//我们可以写一个函数，解决代码重复问题:
function createPerson(name,age){
    return {
        name: name,
        age: age,
        sayName: function () {
            console.log(this.name)
        }
    }
}
//然后生成实例对象:
var p1 = createPerson('Jack', 18)    
var p2 = createPerson('Mike', 18)

构造函数

而要创建Person 实例，则必须使用new 操作符。以这种方式调用构造函数会经历以下4 个步骤：

  1. 创建一个新对象

  2. 将构造函数的作用域赋给新对象（因此this 就指向了这个新对象）

  3. 执行构造函数中的代码

  4. 返回新对象

     function Person(name,age) {
     //当使用new 操作符调用Person()的时候，实际上这里会先创建一个对象
     // var instance ={0}
     //然后让内部的 this指向instance对象
     // this = instance
     //接下来所有针对 this的操作实际上操作的就是instance
     
     this.name = name
     this.age = age
     this.sayName = function () {
         console. log(this.name)
     }
     //在函数的结尾处会将this返回，也就是instance
     // return this
 }

示例：

//构造函数-对象模板this-表示当前对象
function Person(_name, _age, _sex) {
    this.name = _name;
    this.age = _age;
    this.sex = _sex;
    this.readBook = function () {
        console.log(this.name, '读书');
        }
    }

//创建对象，实例化对象
let p1 = new Person( 'jack', 18, '女');
p1.readBook();
let p2 = new Person( '小明', 20, '男');
p2.readBook();

注意：如果对象属性是变量，调用对象属性时，点语句改为中括号

obj.style.background = 'blue '
let bg = 'background'
obj.style[bg] = "blue"

原型prototype

1.构造函数、实例、引用变量、对象名，对象概念区分

image.png

2.Javascript规定，每一个构造函数都有一个prototype属性，指向另一个对象(原型对象prototype)。这个原型对象的所有属性和方法，都会被构造函数的实例访问(继承)。这也就意味着，我们可以把所有对象实例需要共享的属性和方法直接定义在prototype对象上。

image.png

面向对象编程思想

  • 找解决问题对象，如果对象存在公用其功能解决问题
  • 对象不存在，创建对象
  • 构造函数方式创建对象，构造函数:
    • 对象私有的属性和方法定义在构造函数中;
    • 公共的属性和方法定义在原型对象上
    // 构造函数
    function Person(name, age) {
        this.name = name
        this.age = age
    }

    // Person.prototype原型对象
    // 公共的say方法定义到Person构造函数的原型对象上
    // 所有实例对象都可以访问原型对象上公共的属性和方法
    Person.prototype.say = function () {
	console.log('说话')
    }
    
    // 实例对象
    let p1 =  new Person('jack',18)
    let p2 =  new Person('rose',20)
    p1.say()
    p2.say()
  1. 更简单的原型写法
function Person (name, age) {
    this.name = name
    this.age = age
}
    
Person.prototype = {
    constructor:Person,
    type: 'human',
    sayHello: function () {
        console.log('我叫' + this.name + '，我今年' + this.age + '岁了')
    }
}
  1. 原生对象的原型
  • Object.prototype
  • Function.prototype
  • Array.prototype
  • String.prototype
  • Number.prototype
  • Date.prototype

原型链

prototype是构造函数都有的属性，称为显示原型。__proto__是每个对象都有的属性，又称为隐式原型。 但是，__proto__不是一个规范属性，只是部分浏览器实现了此属性，对应的标准属性是[[Prototype]]。

当访问一个对象的某个属性或方法时，会先在这个对象本身上查找，如果没有找到，则会去它的__proto__([[prototype]])隐式原型上查找，即它的构造函数的prototype，如果还没有找到就会再在构造函数的prototype的__proto__中查找，这样一层一层向上查找就会形成一个链式结构，我们称为原型链。

原型链作用：=>访问对象属性或方法时，会沿着原型链上的所有原型进行查找，至到根null为止原型链作用： =>访问对象属性或方法时，会沿着原型链上的所有原型进行查找，至到根null为止

image.png

作用: 1. 属性和方法共享；2. 继承

检查对象类型

let arr =[]
console.log(arr instanceof Array) // => true
console.log(arr instanceof Date) // => false
hasOwnProperty()

Object的hasOwnProperty()方法返回一个布尔值，判断对象是否包含特定的自身（非继承）属性。

类class

面向对象的编程语言中有类(class)的概念(也是一种特殊的数据类型)，但是JS不是面向对象的语言,所以JS中没有类(class)，但是JS可以模拟面向对象的思想编程JS中会通过构造函数来模拟类的概念(class)

//定义名为Person的类class Person{
    //构造器
    constructor(name,age){
        //定义属性
        this.name = name
        this.age = age
    }
    //定义方法
    say() {
        //方法体
    }
}
//创建对象
let p1 = new Person("jack",20)

一切即对象

  • 函数对象

常见方式：function

  • 普通对象

实例对象，原型对象

avatar
文章
阅读
粉丝