2.javascript面向对象

一、什么是面向对象

1.对象是单个事物的抽象。

2.对象是一个容器,封装了属性(property)和方法(method)。

3.在实际开发中,对象是一个抽象的概念,可以将其简单理解为:数据集或功能集。

二、面向对象和面向过程的区别

1.面向过程就是亲力亲为,事无巨细,面面俱到,步步紧跟,有条不紊。

2.面向对象就是找一个对象,指挥得结果。

3.面向对象是面向过程的封装。

面向对象的特性
1.封装:不考虑内部实现,只考虑功能实现把一些比较散的,单一的值,有结构的组装成一个整体。把一些隐藏的值不暴露给外界。
2.继承:从已有对象上,继承出新对象获取已存在的对象已有属性和和方式的一种方式。
3.多态:一个父类的引用变量,可以指向其任意一个子类对象简单来说就是同一操作,作用于不同的对象,会产生不同的解释和行为。

三、js中的面向对象

在js中,任何数据都可以看作是对象。

例:

 var std1 = {
            name: '刘某人',
            age: 23
        }
        var std2 = {
            name: '李某人',
            age: 22
        }

打印数据如下:

function printScore(student) {
            console.log('姓名:' + student.name + '  ' + '成绩:' + student.age)
            }

抽象数据行为模板(Class):

function Student(name, score) {
            this.name = name
            this.score = score
        }
        Student.prototype.printScore = function () {
            console.log('姓名:' + this.name + '  ' + '成绩:' + this.score)
        }

根据模板创建具体实例对象:

var std1 = new Student('张三', 22)
var std2 = new Student('李四', 18)

四、js中如何创建对象

1.直接通过new object()创建:

var person = new Object()
        person.name = '张三'
        person.age = 18​
        person.sayName = function () {
            console.log(this.name)
        }
//也可以通过简写形式:
var person = {
            name: '张三',
            age: 18,
            sayName: function () {
                console.log(this.name)
            }
        }

通过new object()创建的代码过于冗余重复性很多,还不是最简单的。可以通过工厂函数解决这个问题。

工厂函数:

function createPerson(name, age) {
            return {
                name: name,
                age: age,
                sayName: function () {
                    console.log(this.name)
                }
            }
        }
        //生成实例对象
        var p1 = createPerson('张三', 18)
        var p2 = createPerson('李四', 18)

通过工厂模式解决了创建多个相似对象代码冗余的问题, 但却没有解决对象识别的问题。可以通过构造函数来实现更优雅的创建对象方式。总而言之就是构造函数是根据具体的事物抽象出来的抽象模板。

function Person(name, age) {
            this.name = name
            this.age = age
            this.sayName = function () {
                console.log(this.name)
            }
        }​
        var one = new Person('刘老大', 18)
        one.sayName() // => 刘老大
        ​
        var two = new Person('刘老二', 23)
        two.sayName() // => 刘老二

构造函数和实例化对象的关系:

1.实例对象是根据抽象的构造函数模板得到的具体实例对象。

2.每一个实例对象都具有一个 constructor 属性,指向创建该实例的构造函数。

3.同时构造函数也存在浪费内存的问题,就可以把需要共享的函数定义到构造函数的外部。


var fns = {
  sayHello: function () {
    console.log('hello ' + this.name)
  },
  sayAge: function () {
    console.log(this.age)
  }
}
​
function Person (name, age) {
  this.name = name
  this.age = age
  this.type = '学生'
  this.sayHello = fns.sayHello
  this.sayAge = fns.sayAge
}
​
var p1 = new Person('王五', 18)
var p2 = new Person('李四', 16)
​
console.log(p1.sayHello === p2.sayHello)
console.log(p1.sayAge === p2.sayAge)

五、原型

1.Javascript 规定,每一个构造函数都有一个 prototype 属性,指向另一个对象。 这个对象的所有属性和方法,都会被构造函数的实例继承。

可以直接把需要共享的属性和方法直接定义在 prototype 对象上。

function Person (name, age) {
  this.name = name
  this.age = age
}
​
console.log(Person.prototype)
​
Person.prototype.type = '学生'
​
Person.prototype.sayName = function () {
  console.log(this.name)
}
​
var p1 = new Person(...)
var p2 = new Person(...)
​
console.log(p1.sayName === p2.sayName)

六、构造函数、实例、原型三者之间的关系:

1.每个**构造函数**中都有一个默认的属性,叫做prototype。prototype属性保存着一个对象,这个对象我们称之为“**原型对象**”。

2.每个"**原型对象**"中都有一个默认的属性,叫做constructor。这个constructor指向当前原型对象对应的构造函数。

3.通过构造函数创建出来的对象我们称之为“**实例对象**”。每个实例对象都有一个默认的属性,叫做`_proto_`。

4. `__proto__`指向创建它的那个构造函数的**原型对象**。

 2.任何函数都有一个 prototype 属性,该属性是一个对象。

3.构造函数的 prototype 对象默认都有一个 constructor 属性,指向 prototype 对象所在函数。

4.通过构造函数得到的实例对象内部会包含一个指向构造函数的 prototype 对象的指针 __proto__

七、函数和对象

1.JavaScript中的函数是引用类型(对象类型),既然是对象,所以也是通过构造函数创建出来的, “所有函数”都是通过Function构造函数创建出来的对象。
2.JavaScript中只要是"函数",就有prototype属性。Function函数的prototype属性指向**Function原型对象**。
3.JavaScript中只要有**原型对象**就有**constructor**属性。**Function原型对象**的**constructor**指向它对应的构造函数。
4.JavaScript中万物皆对象,只要是对象就有`__proto__`属性。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值