JavaScript 进阶(二)

一、深入对象

1.  创建对象的三种方式

利用 new Object 创建对象

2.  构造函数

【注意事项】

【例】

这样子写好之后,想要添加一个新的结构类似的对象,直接照着红圈中写,最后改相应的数据就好了

注意:红色是第一步,黄色是第二步

这样子引用

【总结】

【练习】

黄框声明,蓝框引用

【补充】实例化执行过程

3.  实例动员&静态动员

(1)实例成员

是相互独立的,对于其他对象和其他成员是互不影响的

(2)静态成员

【总结】

二、内置构造函数

基本包装类型

1.  Object

注意:有了静态方法,不需要循环就可以得到全部数据

(1)获得所有的属性名 keys

【示例】

(2)获得所有的属性值 values

【示例】

(3)对象的拷贝 assign

注意:assign 经常用于给对象添加属性(追加属性)

【示例】

把后面的对象拷贝给前面的对象

【适用场景】 assign 经常用于给对象添加属性(追加属性)

【示例】

2.  Array

(1)数组常见实例方法 - 核心方法

① reduce

实现数组求和

① 没有初始值时,数组内所有元素相加

② 有初始值时,数组内所有元素相加,再加上最后的初始值

箭头函数的写法

结果也为24

无初始值

有初始值

【案例】

reduce 执行过程

(2)数组常见方法-其他方法

① find

② every 

每一个是否都符合条件,如果都符合返回true,否则返回false

③ some 

有一个符合条件,结果就返回true,都不符合则返回false

【练习】

注意:把所选的东西都放到一个盒子里面去

需要处理红框中的数据

这样处理

④ from 

把伪数组转变成真数组

3.  String

注意:转化字符串的两种方法

① split

分割字符串,将原来的字符串,拆分成数组

② substring

字符串的截取

③ startsWith

判断是不是以某个字母开头

返回结果也是 true 或者 false

注意:只要是以 p 开头的,不论什么,结果都是 true

④ includes 

判断某个字符是不是包含在一个字符串里面

【String 练习】

将上述结构中的 gift 内容部分取出来,再将内容渲染到 p 标签中,实现下图效果

【代码】

1.  把字符串拆分成数组

2.  根据数组元素的个数,生成对应的span标签

得到的结果仍然是一个数组

3.  把数组变为字符串

注意:这两部分等价

4.  Number

三、综合案例

效果图

1.  根据数据,渲染页面

注意:map 你有多少数据,就渲染多少个 

注意:每一个对象都返回一个 字符串(div)

2.  更换数据

① 换不需要处理的数据

注意:解构

可以不再使用 item.name item.id 等来获取对象中的数据

可以直接使用 解构时,给起的名字 来使用对象中的数据

item 是每一个对象

效果图

注意:toFixed(2)的意思是保留两位小数

注意:不要再 div 区域中,在任何一个位置加任何一个空格 

② 处理 型号颜色 模块

注意:蓝框中 将数组变为字符串

Object.values 获取到 spec 中的所有值

③ 处理赠品模块

如果有 gift 的话,则前面为真,执行黄框中的语句;没有的话,返回空字符串

用三元运算符

黄框中的语句,先把 gift 分解为数组,再遍历数组并添加元素,再将数组转变为字符串

3.  处理小计模块

4.  合计模块

注意:精度问题,保留两位小数,则乘以100进行计算后,再除以100

若保留一位小数,则乘以10,再除以10

四、【构造函数总结】

好啦!本次的分享到这里就结束啦!我们下次再见!!!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/630390.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

springboot004网页时装购物系统

springboot004网页时装购物系统 亲测完美运行带论文:获取源码,私信评论或者v:niliuapp 运行视频 包含的文件列表(含论文) 数据库脚本:db.sql其他文件:ppt.pptx论文/文档:开题报告.docx论文&…

如何利用命令提示符列出文件?这里提供了几个实例供你参考

序言 什么命令可以用来列出目录中的文件?如何在命令提示符Windows 10/11中列出文件?很多人对这些问题感到困惑。在这篇文章中,我们详细解释了命令提示符列出文件的主题。 CMD(命令提示符)是一个功能强大的Windows内置…

河南广电与LiblibAI签署战略合作协议

5月15日,河南广电科技与LiblibAI战略签约仪式在郑州中原福塔新闻发布厅隆重举行。双方将本着“共商、共享、共建、共赢”原则,基于全面、可持续的战略合作伙伴关系,发挥各自优势,共同聚焦生成式AI领域,围绕内容创作、商…

【永洪BI】管理系统

管理系统模块包括系统设置、认证授权、日志管理、监控预警、资源部署、VooltDB管理、数据库管理、企业应用配置、系统检查、应用管理模块。 系统设置界面: 可以进行清除系统缓存、配置系统主题、配置系统邮箱、配置门户主页、配置权限管理系统、配置密码策略、配置…

音乐的力量

常听音乐的好处可以让人消除工作紧张、减轻生活压力、避免各类慢性疾病等等,其实这些都是有医学根据的。‍ 在医学研究中发现,经常的接触音乐节 奏、旋律会对人体的脑波、心跳、肠胃蠕动、神经感应等等,产生某些作用,进而促进身心…

【MySQl】MySQL概述 | 数据库的操作 | MySQL的编码问题 | 连接器的工作流程

文章目录 一、MySQL概述1.数据库的概念MySQLMySQL中支持的数据类型: 2.数据库的操作1.创建数据库2.查看数据库3.选中数据库4.删除数据库 3.数据表的操作1.创建表2.查看当前数据库中的所有表3.查看指定表的结构4.删除表 二、MySQL的编码问题常见的编码类型 连接器的工…

Linux文件:重定向底层实现原理(输入重定向、输出重定向、追加重定向)

Linux文件:重定向底层实现原理(输入重定向、输出重定向、追加重定向) 前言一、文件描述符fd的分配规则二、输出重定向(>)三、输出重定向底层实现原理四、追加重定向(>>)五、输入重定向…

邦注科技 工业冷水机的风冷和水冷的区别介绍

工业冷水机在工业生产中扮演着重要角色,特别是在需要精确控制温度的应用中。风冷式冷水机和水冷式冷水机是两种常见的类型,它们之间存在一些显著的区别。 热交换的来源不同: 风冷式冷水机:热交换的来源是气体。它采用空气冷却方…

java技术:nacos

目录 一、docker安装 1、创建一个nacos 2、复制配置信息出来(方便修改配置文件) 3、删除nacos 4、修改配置文件(主要是一下几个) 6、创建数据库 nacos 7、重启nacos mysql 一、docker安装 1、创建一个nacos docker run …

随笔:棋友们

我是在小学二年级学会中国象棋的,准确说,是学会象棋的下棋规则的,师傅是二舅。我最早的对手就是同学波仔。波仔比我略早学会象棋,总用连珠炮欺负我,开局几步棋就把我将死。我不知道怎么破解。轮到我先走时,…

几个排序器的verilog及其资源占用、延时分析

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 前言 因为课题需要,调研了几个快速排序方法,并手写或者改进了若干待测试对象,包括记分板型冒泡排序(这个是别人的&#xff09…

Spring Security实现用户认证二:前后端分离时自定义返回Json内容

Spring Security实现用户认证二:前后端分离时自定义返回Json内容 1 前后端分离2 准备工作依赖WebSecurityConfig配置类 2 自定义登录页面2.1 Spring Security的默认登录页面2.2 自定义配置formLogin 3 自定义登录成功处理器4 自定义登录失败处理器5 自定义登出处理器…

如何快速找出文件夹里的全部带有中文纯中文的文件

首先,需要用到的这个工具: 度娘网盘 提取码:qwu2 蓝奏云 提取码:2r1z 步骤 1、打开工具,切换到批量复制文件 2、鼠标移到右侧,点击搜索添加 3、设定查找范围、指定为文件、勾选 包含全部子文件夹&#x…

254 基于matlab的钢筋混凝土非线性分析

基于matlab的钢筋混凝土非线性分析,根据梁本构关系,然后进行非线性分析,绘制弯矩-曲率曲线。可设置梁的截面尺寸、混凝土本构,钢筋截面面积等相关参数,程序已调通,可直接运行。 254 钢筋混凝土非线性分析 弯…

回文数[简单]

优质博文:IT-BLOG-CN 一、题目 给你一个整数x,如果x是一个回文整数,返回true;否则返回false。回文数是指正序(从左向右)和倒序(从右向左)读都是一样的整数。例如,121是…

单位个人如何向期刊投稿发表文章?

在单位担任信息宣传员一职以来,我深感肩上的责任重大。每月的对外信息宣传投稿不仅是工作的核心,更是衡量我们部门成效的重要指标。起初,我满腔热血,以为只要勤勉努力,将精心撰写的稿件投至各大报社、报纸期刊的官方邮箱,就能顺利登上版面,赢得读者的青睐。然而,现实远比理想骨…

最小覆盖子串 ---- 滑动窗口

题目链接 题目: 分析: 当我们找到一组符合的子字符串时, 找下一组让left, 那么剩余的子字符串要么还符合条件, 要么少了一种字符, right一定不用回退, 所以可以使用滑动窗口因为题目中说字符串中自包含英文字母, 所以我们可以使用hash数组 定义left 0;right 0;进窗口进窗口…

如何为没有域名的IP地址申请SSL证书

为没有域名的IP地址申请SSL证书的流程相对直接,但需要确保满足一些特定条件。以下是简化的步骤: 1、确保IP地址是公网IP:你必须拥有一个固定的公网IP地址,因为私有IP地址无法用于申请SSL证书。 2、选择证书颁发机构(…

什么是Zoho CRM客户关系系统管理?

以客户为中心的商业时代,卓越的客户体验已成为企业持续增长与成功的关键,为了在这场激烈的市场竞争中脱颖而出,企业需要一套强大、灵活且智能的客户关系管理系统——Zoho CRM应运而生,它不仅是管理客户信息的工具箱,更是驱动业务增…

利用远程控制软件FinalShell远程连接虚拟机上的Linux系统(Windows)

一. VMware Workstation 安装CentOS Linux操作系统 传送门:VMware Workstation 安装CentOS Linux操作系统 1.右键打开终端 2.输入ifconfig 找到ens33对应 inet的id,这个就是虚拟机的ip地址图中所示为:192.168.5.128 3.打开finalshell 如…