Javascript-面向对象与原型

本文介绍了编程中的面向过程和面向对象思想,重点讲解了构造函数、原型(包括原型定义、constructor属性和对象原型)、原型继承以及封装和原型链的概念。通过实例演示了如何在JavaScript中运用这些概念。
摘要由CSDN通过智能技术生成

1. 编程思想

  • 面向过程就是分析出解决问题所需要的步骤,然后用函数把这些步骤一步一步实现,使用的时候再一个一个调用
  • 面向对象是把食物分解成一个一个对象,然后由对象之间分工合作

面向对象编程

在这里插入图片描述

1.1 面向对象与面向过程对比

在这里插入图片描述

2. 构造函数

在这里插入图片描述
在这里插入图片描述

3. 原型

3.1 原型定义

在这里插入图片描述

    // 任何一个数组都可以使用
    const arr = [1, 2, 3]
    // 自定义方法写到原型上
    Array.prototype.max = function () {
      return Math.max(...this)
    }
    console.log(arr.max());

    // 求和
    Array.prototype.sum = function () {
      return this.reduce((prev, item) => prev + item)
    }

    console.log([1, 2, 3, 4, 5].sum());

3.2 construtor属性

在这里插入图片描述
在这里插入图片描述

3.3 对象原型

在这里插入图片描述

可以理解成构造函数是爸爸,实例对象和原型prototype是两个儿子
在这里插入图片描述

    function Star() { }
    const s = new Star()
    console.log(s.__proto__ === Star.prototype);//true	对象原型指向原型对象

总结

在这里插入图片描述

4. 原型继承

在这里插入图片描述

4.1 封装

在这里插入图片描述
在这里插入图片描述

5. 原型链

在这里插入图片描述

只要是对象就有__proto__
在这里插入图片描述
原型链属于一种查找规则,由于这条线路的存在,可以不断往上查找属性和方法,直到查完为止

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值