首页 > 编程语言 >【JavaScript25】关于prototype

【JavaScript25】关于prototype

时间:2023-08-08 21:33:19浏览次数:40  
标签:__ p1 name 对象 JavaScript25 Person 原型 关于 prototype

老版本的js中是没有类的概念的.js如何构建一个对象的呢?

  • 在js中, 每一个函数都可以作为构建一个对象的构造方法
  • 函数又可以被称为 构造函数 constructor 构造器, 构造方法
function Person(name, age){
    // 给当前对象(内存)进行初始化
    this.name = name;
    this.age = age;
    // 这里有隐藏的一句话. return this
    console.log(this);
}
// new表示创建 -> new就是在开辟一个新内存.
// 需要初始化该对象 ,  new后面的函数表示如何初始化这个新内存
var p1 = new Person("xwl", 19);
console.log(p1);

类呢? 方法怎么办?

  • 在前端, es6之前. 就没有类. 方法的编写有两个办法
  • 1、可以在对象初始化的时候. 直接在对象身上写方法
  • 2、所有的函数在创建的时候. 都会自动创建一个函数的原型对象.原型对象充当了类的角色,在类中添加一个新的方法
//1、可以在对象初始化的时候. 直接在对象身上写方法
 function Person(name){
    this.name = name;
    this.eat = function(){  // 直接在对象身上植入方法.
        console.log(this.name, "在吃东西");
    }
}

var p1 = new Person("xwl");
p1.eat(); // 方法的调用

//2、原型对象充当了类的角色,添加方法
function Person(name){
    this.name = name;
}

// 程序执行到这里. 在内存中. 会产生两个东西
// 一个是函数本身(constructor)
// 一个是函数对应的原型对象(prototype), 充当的就是类的角色
// console.log(Person);
// console.log(Person.prototype);

// 在类中添加一个新的方法. 叫eat
Person.prototype.eat = function(){
    console.log(this.name, "在吃东西");
};

var p1 = new Person("xwl"); // 会调用Person函数
p1.eat();

总结

// 在对原型没有任何操作之前.
// Person === Person.prototype.constructor 成立的.
// Person.prototype === p1.__proto__ 成立的.
// p1.__proto__.__proto__.__proto__ === null 成立的.

// js中所有的对象. 身上有一个特殊的属性. __proto__ 它表示该对象的原型对象.

// 程序在执行p1.eat()的时候.
// 不论是执行方法还是查找属性. 都是同一个逻辑.
// 执行过程:
// 首先, 在对象自身去查找该方法/属性是否存在.
// 如果存在了, 就直接返回或执行了.
// 如果不存在呢?
// 就会去找该对象的原型对象(__proto__), 去找该方法是否存在. 如果存在. 就执行
// 原型对象上如果不存在呢? 继续查找原型对象的原型对象(__proto__). 持续查找. 直到最后找到null为止.

// 上述逻辑就是js的原型链.

标签:__,p1,name,对象,JavaScript25,Person,原型,关于,prototype
From: https://www.cnblogs.com/xwltest/p/17610281.html

相关文章

  • 深入浅出关于微服务架构实战指南:分布式系统的设计与部署技巧
    深入浅出关于微服务架构实战指南:分布式系统的设计与部署技巧微服务架构实战指南:分布式系统的设计与部署技巧摘要:随着互联网应用的快速发展,传统的单体应用架构已经无法满足高可用、可扩展、快速迭代等需求。微服务架构的出现为解决这些问题提供了一种新的思路。本文将深入探讨微......
  • c#关于终止thread 学习经典
    C#多线程学习笔记之(abort与join配合使用)转载:************   原文中的评论,有便于理解的内容*************************C#多线程学习笔记之(abort与join配合使用)  今天刚开始学多线程,尽管以前用过一点点,但是只是照着网上代码抄,没有真正理解,现在回过头来想研究研究,......
  • 【JavaScript22】关于window
    window对象就是JavaScript的Global对象,所以在使用window对象的属性和方法是不需要特别指明。如:alert,实际上完整的调用是window.alert,通常省略了window对象的引用。//var直接在全局声明的变量,就是全局变量.let不是......varname="xwl";//全局变量,这种变量.实际上是......
  • 【JavaScript21】关于Storage
    本地存储.存储在浏览器端的数据.可以理解成一个小型的非关系型数据库.localStorage和sessionStorage这俩玩意使用上是一样的.区别在于.一个是永久存储一个是临时存储.localStorage永久存储sessionStorage临时存储,浏览器关闭后.数据就没了.document.cookie也......
  • 关于Java的IO流开发
    IO概述回想之前写过的程序,数据都是在内存中,一旦程序运行结束,这些数据都没有了,等下次再想使用这些数据,可是已经没有了。那怎么办呢?能不能把运算完的数据都保存下来,下次程序启动的时候,再把这些数据读出来继续使用呢?其实要把数据持久化存储,就需要把内存中的数据存储到内存以外的其他......
  • 笔记(一)---关于数据库连接对象释放
    publicvoidDispose(){Release();}publicvoidRelease(){try{if(connection!=null&&connection.State!=ConnectionState.Closed){......
  • 关于一个很抽象的马
    中午大佬学长给我们发了个免杀马,捅咕一中午才看明白,简单记录下主要就是先用pack给他切割了一下,然后再转换下进制,传参的时候先传要截断多少,后边命令的代码要先转换成16进制,然后再在两头加上要截断的位数,把中间保留下来代码是别人的,这里就不贴了,说说另一个很抽象的马1<?php2......
  • 关于引用elementui中的el-date-picker组件
    最近有一个需求要用到elementui中的日期选择器组件,但是elementui中的不太满足,在网上找到一个引用里面的组件的教程https://blog.csdn.net/mouday/article/details/103932261但是引用完成后报错Moduleparsefailed:Unexpectedtoken(65:6)Youmayneedanappropriateloader......
  • 关于台式电脑散热的那些事情——开放式机箱的极致散热
    由于搞AI,于是自己家中买了几台workstation,虽然正事没弄明白多少但是闲事却搞的有滋有味,其中的一件就是机箱散热的问题。 对于机箱散热的问题前些年曾经写过一个机房机柜的设计,简单的说那就是直接把冷气直接打到机柜里,而机柜也搞成半封闭的状态,这样的散热效果一定要好于当前的机房......
  • 微信小程序9 关于解密,前端解密
    我们之前在学习button时,可以通过调用getphonenumber获取手机号,但是获取后却发现是加密了的,那么如何解密呢,微信官方提供了相应的方法。 1.首先我们可以去下载官方提供的解密的js放在本地,推荐放到这个utils文件下。关键是这个RdWXBizDataCrypt.js文件,可以通过这个名字去百度。......