当前位置: 首页 > news >正文

js构造函数

构造函数

通过 new 函数名 来实例化对象的函数叫构造函数。
任何的函数都可以作为构造函数存在。之所以有构造函数与普通函数之分,主要从功能上进行区别的,构造函数的主要 功能为 初始化对象,特点是和new 一起使用。new就是在创建对象,从无到有,构造函数就是在为初始化的对象添加属性和方法。构造函数定义时首字母大写(规范)。

function Person(name) {this.name = name;
}let p1 = new Person('张三'); // 实例化console.log(p1); // Person {name: "张三"}

此时,p1就是一个新对象。

1. new一个新对象的过程,发生了什么?

  1. 创建一个空对象obj {}
  2. 空对象的_proto_指向了构造函数的prototype成员对象
  3. 使用apply调用构造器函数,属性和方法被添加到 this 引用的对象中
  4. 如果构造函数中没有返回其它对象,那么返回 this,即创建的这个的新对象,否则,返回构造函数中返回的对象

对new理解:new 申请内存, 创建对象,当调用new时,后台会隐式执行new Object()创建对象。所以,通过new创建的字符串、数字是引用类型,而是非值类型。

2. 手写new函数

function _new(func, ...args) {// 1. 创建空对象let obj = {};// 2. 空对象的_proto_指向了构造函数的prototype成员对象obj.__proto__ = func.prototype; // 一二步合并就相当于 let obj = Object.create(func.prototype)// 3. 使用apply调用构造器函数,属性和方法被添加到 this 引用的对象中let result = func.apply(obj, args);// 4. 确保 new 出来的是个对象return typeof result === 'object' ? result : obj;
}

测试用例:

function Person(name, age) {this.name = name;this.age = age;
}let obj = _new(Person, 'xia', 20);console.log(obj); // Person {name: "xia", age: 20}

3. 构造函数上的方法

  1. 在构造函数上直接定义方法(不共享)
function Person() {this.say = function () { // 直接定义方法console.log('hello');}
}let p1 = new Person();
let p2 = new Person();
p1.say(); // hello
p2.say(); // helloconsole.log(p1.say === p2.say); // false

很明显,p1 和 p2 指向的不是一个地方。 所以 在构造函数上通过 this 来添加方法的方式来生成实例,每次生成实例,都是新开辟一个内存空间存方法。这样会导致内存的极大浪费,从而影响性能

  1. 通过原型添加方法(共享)

构造函数通过原型分配的函数,是所有对象共享的。

function Person(name) {this.name = name;
}
Person.prototype.say = function () { // 通过原型添加方法console.log('hello ' + this.name);
}let p1 = new Person('张三');
let p2 = new Person('李四');
p1.say(); // hello 张三
p2.say(); // hello 李四console.log(p1.say === p2.say); // true

所以我们经常 将公共属性定义到构造函数里,将公共方法放到原型对象上

点击查看“构造函数的五种继承方式”

相关文章:

js构造函数

构造函数 通过 new 函数名 来实例化对象的函数叫构造函数。 任何的函数都可以作为构造函数存在。之所以有构造函数与普通函数之分,主要从功能上进行区别的,构造函数的主要 功能为 初始化对象,特点是和new 一起使用。new就是在创建对象&#x…...

性能测试-redis常见问题

缓存击穿、缓存穿透、缓存雪崩 缓存雪崩 解决办法 1.设置缓存失效时间,不要在同一时间 2.redis集群部署 3.不设置缓存设置时间 4.定时刷缓存的时间 缓存穿透 请求不管返回什么数据都返回给redis对参数合法器进行验证,不合法的时候直接过滤掉使用布…...

预测:2024 年将是互联网永远改变的一年。

人工智能的下一步发展将彻底改变互联网的各个方面。 如果你真的认为人工智能只是另一个炒作周期,那么你就会迎来新的觉醒。 以下是即将发生的事情: 1. 自主待办事项列表/代理:无需人工干预即可执行任务的人工智能。 这些代理将发送您的电子邮…...

Vue2 与 React 的区别

【5年以上前端】Vue 和 React 的区别看这里 - 知乎 vue和react的区别_vue react-CSDN博客 Vue 和 React 有什么不同?_vue和react区别-CSDN博客 1、相同点: ① 都使用了虚拟 DOM; ② 组件化开发; ③ 都是单向数据流&#xff…...

【AI视野·今日Robot 机器人论文速览 第五十一期】Tue, 10 Oct 2023

AI视野今日CS.Robotics 机器人学论文速览 Tue, 10 Oct 2023 Totally 54 papers 👉上期速览✈更多精彩请移步主页 Daily Robotics Papers On Multi-Fidelity Impedance Tuning for Human-Robot Cooperative Manipulation Authors Ethan Lau, Vaibhav Srivastava, Sh…...

零经验想跳槽转行网络安全,需要准备什么?

最近在后台看到很多私信都是有关转行网络安全的问题,目前咨询最多的都是:觉得现在的工作没有发展空间,替代性强,工资低,想跳槽转行网络安全。其中,他们主要关心的是:没有经验怎么学习&#xff1…...

Rust-是否使用Rc<T>

Rust的所有权机制,数据允许通过借用的方式,在函数的上下文中传递数据。如果离开数据作用的有效范围,这个借用就会失效,编译就会报错。这也是我们不会将借用(引用)作为函数的返回值的原因。下面的代码编译失败。 fn cr…...

论文解析——一种面向Chiplet互连的高效传输协议设计与实现

作者及发刊详情 熊国杰, 张津铭, 贺光辉. 一种面向Chiplet互连的高效传输协议设计与实现[J]. 计算机工程与科学, 2023, 45(08): 1339-1346.XIONG Guo-jie, ZHANG Jin-ming, HE Guang-hui. Design and implementation of an efficient transmission protocol for Chiplet inter…...

svo2.0 svo pro 编译运行

sudo apt-get install python-catkin-tools python-vcstool unable to locate python-vcstool 添加ros源 然后sudo apt update 依赖库下载,查看dependencies.yaml文件: 逐个clone到src目录下即可 dbow2_catkin 编译出错: 把https://gi…...

微信小程序前端生成动态海报图

//页面显示<canvas id"myCanvas" type"2d" style" width: 700rpx; height: 600rpx;" />onShareShow(e){var that this;let user_id wx.getStorageSync(user_id);let sharePicUrl wx.getStorageSync(sharePicUrl);if(app.isBlank(user_i…...

SQL如何导入数据以及第一次上机作业

如何导入excel数据 首先得学会导入数据 使用excel格式不需要改成其它格式&#xff08;如csv&#xff0c;txt&#xff09;&#xff0c;因为你改了到时候还是会报错&#xff08;实践过使用Sum统计总数一直说我数据格式有问题&#xff09; 首先右键TSGL数据库->任务->导入数…...

数据结构-----红黑树简介

目录 前言 1.什么是红黑树&#xff1f; 2.为什么需要红黑树&#xff1f;&#xff08;与AVL树对比&#xff09; 3.红黑树的特性 前言 在此之前我们学习过了二叉排序树和平衡二叉树&#xff08;AVL树&#xff09;&#xff0c;这两种树都是属于搜索树的一种&#xff0c;那么今天…...

哈佛教授因果推断力作:《Causal Inference: What If 》pdf下载

因果推断是一项复杂的科学任务&#xff0c;它依赖于多个来源的三角互证和各种方法论方法的应用&#xff0c;是用于解释分析的强大建模工具&#xff0c;同时也是机器学习领域的热门研究方向之一。 今天我要给大家推荐的这本书&#xff0c;正是因果推断领域必读的入门秘籍&#…...

Drecom 的《Eternal Crypt - Wizardry BC -》加入 The Sandbox 啦!

经典 “Wizardry” 游戏系列的新区块链迭代将通过全球合作拓展 Web3 游戏宇宙。 我们非常高兴地宣布&#xff0c;沙盒游戏公司与富有远见的传奇游戏《Wizardry》系列创造者 Drecom 将建立充满活力的合作伙伴关系。我们将共同推出《Eternal Crypt - Wizardry BC -》&#xff0c…...

外贸网站流量下降可能是这五点原因造成的

随着互联网的发展&#xff0c;企业开始重视网站优化&#xff0c;越来越多的人开始从事网站优化工作&#xff0c;然而真正做起来&#xff0c;很多站长朋友并非一帆风顺&#xff0c;往往越到很多问题&#xff0c;比如外贸网站流量出现异常下降情况&#xff0c;但很多时候在遇到外…...

交通部 EDI是什么?如何处理?

交通部于1996年开始实施《国际集装箱运输电子信息传输和运作系统及示范工程》&#xff0c;即在中国远洋运输集团、上海口岸、宁波口岸、天津口岸和青岛口岸建立 EDI 示范工程。 交通部 EDI 的数据结构 电子口岸或者其他物流企业需要确保能够生成和解析符合交通部要求的EDI数据…...

【Redis】Java Spring操作redis

目录 引入Redis依赖StringRedisTemplate使用String使用List使用Set使用hash使用zset 引入Redis依赖 StringRedisTemplate 此处RedisTemplate是把这些操作Redis的方法&#xff0c;分成了几个类别&#xff0c;分门别类的来组织的。 此处提供的一些接口风格&#xff0c;和原生的Re…...

如何养好一个微信新号?

最近听到一句话&#xff0c;“微信是个完整的互联网”。 你还真别说&#xff0c;真是。如果你还觉得微信只是个聊天视频打电话的工具&#xff0c;那可就有信息差了。 微信有各种各样的小程序&#xff0c;有打车的&#xff0c;有交话费的&#xff0c;有游戏&#xff0c;可以说&a…...

flutter问题汇总

一直卡在building a flutter app for general distribution&#xff1b; AS Message窗口显示 依赖下载失败&#xff1a; 1、修改仓库地址的配置&#xff1a;android/build.gradle repositories {maven { url https://download.flutter.io }maven { url "https://maven.a…...

2.1 初探大数据

文章目录 零、学习目标一、导入新课二、新课讲解&#xff08;一&#xff09;什么是大数据&#xff08;二&#xff09;大数据的特征1、Volume - 数据量大2、Variety - 数据多样3、Velocity - 数据增速快4、Value - 数据价值低5、Veracity - 数据真实性 &#xff08;三&#xff0…...

论自动化测试中的xpath | 多语言测试最新案例

XPath&#xff08;XML Path Language&#xff09;是一门在XML文档中查找信息的语言。XPath是XML处理中非常重要的组成部分&#xff0c;能大大简化文档的解析和处理。它与XSLT、XPointer等标准一起被广泛应用于XML的解析处理。 一般情况下&#xff0c;xpath主要应用在以下几个方…...

CSS基础详细解析(附带综合小练习)

目标&#xff1a;掌握 CSS 属性基本写法&#xff0c;能够使用文字相关属性美化文章页。 01-CSS初体验 层叠样式表 (Cascading Style Sheets&#xff0c;缩写为 CSS&#xff09;&#xff0c;是一种 样式表 语言&#xff0c;用来描述 HTML 文档的呈现&#xff08;美化内容&#…...

react中ant.design框架配置动态路由

目录 什么是动态路由&#xff1f; 应用场景&#xff1a; ant.design动态路由如何配置&#xff1a; 首先&#xff1a;找到app.tsx文件 然后&#xff1a;找到menuHeaderRender 其次&#xff1a;修改menuHeaderRender为menuDataRender​编辑 最后&#xff1a;在箭头函数里re…...

Linux运行环境搭建系列-Openresty安装

安装Openresty 构建环境&#xff1a;腾讯云CentOS 7.9。 更新云库 yum update添加&&安装云库 wget https://openresty.org/package/centos/openresty.repo sudo mv openresty.repo /etc/yum.repos.d/ sudo yum check-update sudo yum install openresty安装命令行工具…...

React TreeSelect设置默认展开项的方法

需要实现TreeSelect组件的onTreeExpand、treeExpandedKeys方法。 代码样例如下&#xff1a; 1.TreeSelect标签部分 render() {const {codeselect} this.props;const {treeExpandedKeys} this.state ................<TreeSelectshowSearch{false}dropdownStyle{{ maxHei…...

Golang基础学习笔记

Golang基础学习笔记 1、下载安装 1.1、下载 Golang下载地址&#xff1a;https://golang.google.cn/dl/ 1.2、安装 1.3、环境变量 # GOPATH D:\GolandProjects# GOPROXY https://mirrors.aliyun.com/goproxy# 启用Go模块支持 go env -w GO111MODULEon1.5、验证安装/配置 1.…...

ES _bulk 批量操作用法

es 的 bulk 操作&#xff0c;是用来批量发送请求&#xff0c;或者理解为批量操作的。 支持4种操作 bulk 支持多种操作&#xff0c;如下create、index、update、delete。 create 如果文档不存在就创建&#xff0c;但如果文档存在就返回错误index 如果文档不存在就创建&#x…...

LCR 176.判断是否为平衡二叉树

​​题目来源&#xff1a; leetcode题目&#xff0c;网址&#xff1a;LCR 176. 判断是否为平衡二叉树 - 力扣&#xff08;LeetCode&#xff09; 解题思路&#xff1a; 若树中任意节点左子树是平衡二叉树&#xff0c;右子树是平衡二叉树 且该节点左右子树平衡&#xff0c;则该树…...

跨境商城源码有哪些独特的功能和优势

1. 强大的跨境支付功能 跨境商城源码具备强大的跨境支付功能&#xff0c;支持多种支付方式&#xff0c;包括信用卡、支付宝、微信支付等。该功能遵循国际支付标准&#xff0c;能够确保支付过程的安全性和可靠性&#xff0c;为用户提供便捷的跨境购物体验。 2. 多语言和多货币支…...

latex如何对.pdf格式的图片实现裁剪

目录 问题描述&#xff1a; 问题解决&#xff1a; 问题描述&#xff1a; 在使用draw.io进行绘图&#xff0c;导出的时候不知道为什么周围会有留白&#xff0c;比如下图&#xff1a; 在导入latex的时候&#xff0c;会因为两侧的留白导致整张图片缩小。 如果直接进行裁剪.pdf&a…...

优秀个人网站设计/网站设计公司哪家专业

在.NET里,客户端与服务端进行数据交互我想大多数朋友都遇到过这样的问题,语言不同,又怎么来实现交互呢.客户端的 JavaScript是弱类型语言,服务端是强类型语言(如:C#,VB.NET,VC,J#等).两个不同语言之间的交互是不是要借助于别的东西呢.我在这里可以告诉大家的是:答案不一定,但是…...

网页传奇版本/潍坊seo关键词排名

下一代安全企业Palo Alto Networks&#xff08;纽交所代码&#xff1a;PANW&#xff09;近日详细披露了一款最新“BackStab”恶意软件&#xff0c;该攻击模式主要是从存储在被感染电脑上的移动设备备份文件中窃取私人信息。Palo Alto Networks公司Unit 42威胁情报团队在白皮书中…...

公司的网页设计/太原seo服务

1.概述我们可以通过多种方式从Java连接到MySQL数据库&#xff0c;在本文中&#xff0c;我们将探索几种方法来实现这一目标。首先&#xff0c;我们将探讨使用JDBC和Hibernate的最受欢迎的选项。然后&#xff0c;我还将研究一些外部库&#xff0c;包括MyBatis&#xff0c;Apache …...

网站建设项目发票/个人网页制作完整教程

http://codeforces.com/problemset/problem/1213/D2 题目大意&#xff1a;给nnn个数&#xff0c;每一次操作可以任意选择一个数aia_{i}ai​&#xff0c;使aiai/2a_{i}a_{i}/2ai​ai​/2(向下取整)。问至少需要多少次操作才能使得序列中有kkk个相等的数。 思路&#xff1a;排序后…...

设计师可以做兼职的网站有哪些/网页设计与制作模板

RestCloud API服务编排平台&#xff0c;更轻量、更高性能的API可视化编排平台&#xff0c;基于微服务架构、快速构建企业服务总线、全面提升敏捷集成能力、每日调度API流程超过100W。 一、真正的高性能服务编排引擎 1、首创基于纯内存的流程调度引擎&#xff0c;是支持高频调度…...

用cms做网站的缺点/抖音搜索seo软件

.无穷大功率电源供电系统实验目的&#xff1a;1. 理解掌握无穷大功率电源供电系统2. 通过 MATLAB的电力系统工具箱&#xff0c;对无穷大功率电源供电系统进行建模&#xff0c;并观察分析其波形。实验内容&#xff1a;图 2.1 无穷大功率电源供电系统其模型模块名 提取路径无穷大…...