JavaScript对象及初识面向对象 js的面向对象

转载

误会一场 2023-10-08 14:45:08

文章标签 JavaScript对象及初识面向对象面向对象编程 javascript 面向对象构造函数 文章分类 JavaScript 前端开发

js面向对象怎么理解

<一>、认识对象。

首先要认识对象：在编程中，对象(object)是具体的某一个实例，唯一的某一个个体。如：电脑就是一个统称，而你面前的这一台电脑就是对象。而电脑的统称在编程中叫做类，概念就是：具有一类相同特征事物的抽象概念。在js中只有对象的概念。没有类的概念，在ECMA6中必须加回来。

对象的语法：(创建对象)

var obj1 = new Object();
 var obj2 = Object();
 var obj3 = {};

<二> 、在js中面向对象的编程思想是什么呢？

直接将生活逻辑映射到我们的编程中。

1.分析应用题里的实体。2.分析实体的属性和性能。3.实体之间相互作用得出结果。

<三>、对象：既可以存储数据，又可以存储函数的结构。

<四>、用面向对象创建一个人的方法：

var person = new Object();
        person.name = "blue";
        person.sex = "男";
        person.showName = function(){
           alert("我的名字叫:" + this.name);
        }
        person.showSex = function(){
           alert("我的性别是" + this.sex + "的");
        }`

一下是封装函数创造一个人，也叫作使用new构造函数（本质上是构造对象），在JS中的构造函数充当的角色是类的存在。

function createPerson(name, sex){
    var obj = new Object();
    obj.name = name;
    obj.sex = sex;
    obj.showName = function(){
       alert("我的名字叫" + this.name);
    }
    obj.showSex = function(){
        alert("我的性别是" + this.sex + "的");
    }
    return obj;
}
    var p1 = createPerson("blue", "男");

<五>、继承和多态

在JS中一切皆对象。

继承：从父一级继承到的属性和方法。

1. 原型链继承 继承方法
       for(funcName in Person.prototype){
            Worker.prototype[funcName] = Person.prototype[funcName];
       }
		在任何函数上都有一个叫做prototype原型的属性，他是一个对象，如果我们将函数添加给某一个可以创建对象的函数的原型prototype，该函数共享。
        
       2.Object.create  根据原对象，生成一个新对象
      Worker.prototype = Object.create(Person.prototype);

        3、直接通过调用构造函数继承
        worker.prototype = new Person();

多态：我自己拓展和重写的属性和方法。

function Person(name, sex){
    this.name = name;
    this.sex = sex;
}

Person.prototype.showName = function(){
    alert(`我的名字是：` + this.name);
}
Person.prototype.showSex = function(){
    alert(`我的性别是：` + this.sex);
}

function Worker(name, sex, job){
     Person.call(this, name, sex);
     this.job = job;
}
Worker.prototype.showJob = function(){
     alert(`我的工作是` + this.job);
}
var w1 = new Worker("red", "女", "画家");
w1.showName();
w1.showSex();
w1.showJob();