zoukankan      html  css  js  c++  java
  • javaScript构造函数、原型、原型链

    构造函数是一种特殊的函数,主要用来初始化对象,为对象成员赋初始值,它与new 一起使用。一般用于将公共属性和方法抽取出来,封装到函数中。

    new 在执行时会做四件事:

    1. 在内存中创建一个新的空对象。
    2. 让this 指向这个新对象。
    3. 根据构造函数中的代码,为这个对象添加属性和方法。
    4. 返回这个新对象。(构造函数不需要return)
    class Person {
        constructor(name, age){
            this.name = name
            this.age = age
        }
    
        say(){
            console.log('my name is ' + this.name)
        }
    }
    const jack = new Person('jack', 20)
    jack.say()
    // 打印 my name is jack
    

    构造函数存在的问题:

    如果直接在构造函数上添加方法,每次new一个新对象,会单独开辟一块新的内存空间。由于方法是通用的,每次new新对象都占用部分内存资源比较冗余浪费内存空间。因此在构造函数中定义方法一般会定义在它的原型链上,让所有new出来的新对象共享同一个对象上的方法。

    构造函数的原型

    • 每个函数都有一个prototype 属性,这个prototype也是一个对象, 是JavaScript默认添加的,一般把这个对象称之为原型对象。而构造函数拥有这个原型对象所有的属性和方法。

    • 构造函数通过原型对象分配的函数是所有new出来的新对象共享的。因此在使用中我们可以把一些不变的方法直接定义在prototype对象上,让所有对象实例共享这些方法。

    function Person(name){
        this.name = name
    }
    Person.prototype.say = function(){
        console.log('打印', 'my name is ' + this.name)
    }
    const jack = new Person('jack')
    jack.say()
    // 打印 my name is jack
    

    对象原型

    • 每个对象都会有一个__proto__ 的属性,指向构造函数的prototype 原型对象。对象能使用构造函数的的原型对象prototype上的属性和方法,就是因为__proto__ 原型的存在。
    • __proto__ 对象原型和 prototype 构造函数原型是等价的。
    • __proto__ 对象原型的意义在于为对象的查找机制提供一个方向,或者说一条路线。但是它是一个非标准属性,在实际开发中,不可以使用这个属性,他的作用只是指向内部函数原型prototype
    const obj =  {name : 'xiaowang'}
    console.log('打印', obj)
    // 打印
    Object
    name: "xiaowang"
    __proto__:
    constructor: ƒ Object()
    __defineGetter__: ƒ __defineGetter__()
    __defineSetter__: ƒ __defineSetter__()
    hasOwnProperty: ƒ hasOwnProperty()
    __lookupGetter__: ƒ __lookupGetter__()
    __lookupSetter__: ƒ __lookupSetter__()
    isPrototypeOf: ƒ isPrototypeOf()
    propertyIsEnumerable: ƒ propertyIsEnumerable()
    toString: ƒ toString()
    valueOf: ƒ valueOf()
    toLocaleString: ƒ toLocaleString()
    get __proto__: ƒ __proto__()
    set __proto__: ƒ __proto__()
    

    constructor 构造函数

    • 对象原型(__proto__ )和构造函数原型(prototype)里面都有一个constructor属性。constructor 称之为构造函数,它指回构造函数本身。
    • constructor 主要用于记录该对象引用自哪个构造函数,它可以让原型对象重新指向原来的构造函数。
    function fn(){}
    console.log("打印", fn.prototype );
    // 打印
    {constructor: ƒ}
    constructor: ƒ fn()
    __proto__: Object
    
    console.log('打印', tom.__proto__)
    // 打印
    {constructor: ƒ}
    constructor: ƒ Person(name)
    __proto__: Object
    

    原型链

    1.构造函数的原型protoptype指向Object的原型,Object的原型__proto__指向null。
    2.对象实例的原型__proto__指向构造函数的原型prototype。
    

    方法与属性的查找规则

    查找对象本身的__proto__ 上的方法 => 查找原型对象prototype 上的方法 => 查找Object对象的__proto__ 上的方法,如果Object上没有则指向 null

  • 相关阅读:
    Oracle学习笔记(oracle日期处理)
    Oralce学习笔记(plsql链接客户端)
    innerText和innerHTML应用
    oracle学习笔记(行转列列转行)
    js工作笔记基础一(分隔字符串)
    Oracle学习笔记(动态函数调用)
    理解!Page.IsPostBack和NET控件中的AutoPostBack
    oracle学习笔记(包头模板)
    div拖动层自己写
    oralce学习笔记(包体模板)
  • 原文地址:https://www.cnblogs.com/xiaomeng95/p/12976340.html
Copyright © 2011-2022 走看看