21JS12——内置对象

news2024/11/25 5:01:12

文章目录

  • 一、内置对象
  • 二、查文档
    • 1、 MDN
    • 2、如何学习对象中的方法
  • 三、Math对象
    • 1、Math对象
    • 2、案例-封装自己的数学对象
    • 3、Math的几个方法
      • (1)绝对值
      • (2)三个取整方法
      • (3)随机数方法random()
    • 4、猜数字游戏
  • 四、日期对象
    • 1、Date概述
    • 2、Date()方法的使用
    • 3、日期格式化
    • 4、获取日期的总的毫秒形式
      • (1)概述
      • (2)案例——倒计时效果
  • 五、数组对象
    • 1、创建数组对象的两种方式
    • 2、检测是否为数组
    • 3、添加删除数组元素的方法
      • (1)push():在数组末尾添加一个或多个元素
      • (2)unshift():给数组前面追加一个或多个元素元素
      • (3)pop():删除数组最后一个元素
      • (4)shift():删除数组的第一个元素
      • (5)案例——筛选工资
    • 4、数组排序
    • 5、数组索引方法
      • 案例:数组去重(重点案例)
    • 6、数组转换为字符串
    • 7、其他方法
  • 六、字符串对象
    • 1、基本包装类型
    • 2、字符串的不可变
    • 3、根据字符返回位置
    • 4、根据位置返回字符(重点)
      • 案例
    • 5、字符串操作方法

目标:
1、内置对象
2、查文档
3、Math对象
4、日期对象
5、数组对象
6、字符串对象

一、内置对象

· JS中的对象分为3种:自定义对象、内置对象、浏览器对象
· 前面两种对象是JS基础内容,属于ECMAScript;第三个浏览器对象属于我们JS独有有的,我们JSAPI讲解
· 内置对象就是指JS语言自带的一些对象,这些对象供开发者使用,并提供了一些常用的或是最基本而必要的功能(属性和方法)
· 内置对象最大的优点就是帮助我们快速开发
· JavaScript提供了多个内置对象:MathDate Arraystring等

二、查文档

1、 MDN

· 学习一个内置对象的使用,只要学会其常用成员的使用即可,我们可以通过查文档学习,可以通过MDN/W3C来查询。
· Mozilla开发者网络(MDN)提供了有关开放网络技术(OpenWeb)的信息,包括HTMLCSS和万维网及 HTML5应用的API。
· MDN:https://developermozilla.org/zh-CN/

2、如何学习对象中的方法

1.查阅该方法的功能
2.查看里面参数的意义和类型
3.查看返回值的意义和类型
4.通过demo进行测试

三、Math对象

1、Math对象

Math数学对象 不是一个构造函数,所以我们不需要new来调用而是直接使用里面的属性和方法即可。
在这里插入图片描述

2、案例-封装自己的数学对象

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

3、Math的几个方法

Math对象不是构造函数,它具有数学常数和函数的属性和方法。跟数学相关的运算(求绝对值,取整、最大值等)可以使用Math中的成员。
在这里插入图片描述

(1)绝对值

在这里插入图片描述

(2)三个取整方法

在这里插入图片描述

(3)随机数方法random()

· Math对象随机数方法:random()返回一个随机的小数0 <= x < 1
· 这个方法里面不跟参数
· 得到两个数之间的随机整数,并且包含这2个整数
在这里插入图片描述
· 随机点名
在这里插入图片描述

4、猜数字游戏

程序随机生成一个1~10之间的数字,并让用户输入一个数字,
1.如果大于该数字,就提示,数字大了,继续猜;
2.如果小于该数字,就提示数字小了,继续猜;
3.如果等于该数字,就提示猜对了,结束程序。
案例分析:
①随机生成一个1~10的整数我们需要用到Math.random()方法。
②需要一直猜到正确为止,所以一直循环。
③用while循环合适更简单。
④核心算法:使用if else if多分支语句来判断大于、小于、等于。
在这里插入图片描述

四、日期对象

1、Date概述

· Date对象和Math对象不一样,他是一个构造函数,所以我们需要实例化后才能使用
· Date实例用来处理日期和时间

2、Date()方法的使用

(1)获取当前时间必须实例化
在这里插入图片描述
(2)Date()构造函数的参数
如果括号里面有时间,就返回参数里面的时间。例如日期格式字符串为’2019-5-1’,可以写成newDate(‘2019-5-1’)或者newDate(‘2019/5/1’)

3、日期格式化

需要获取日期指定的部分,我们要手动的得到这种格式
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

4、获取日期的总的毫秒形式

(1)概述

· Date对象是基于1970年1月1日(世界标准时间)起的毫秒数
· 我们经常利用总的毫秒数来计算时间,因为精确
在这里插入图片描述

(2)案例——倒计时效果

在这里插入图片描述
核心算法:
①输入的时间减去现在的时间就是剩余的时间,即倒计时,但是不能拿着时分秒相减,比如05分减去25分,结果会是负数的。
②用时间戳来做。用户输入时间总的毫秒数减去现在时间的总的毫秒数,得到的就是剩余时间的毫秒数。
③把剩余时间总的毫秒数转换为天、时、分、秒(时间戳转换为时分秒)
在这里插入图片描述
在这里插入图片描述

五、数组对象

1、创建数组对象的两种方式

· 字面量方式
· new Array()
在这里插入图片描述

2、检测是否为数组

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

3、添加删除数组元素的方法

在这里插入图片描述

(1)push():在数组末尾添加一个或多个元素

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

(2)unshift():给数组前面追加一个或多个元素元素

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

(3)pop():删除数组最后一个元素

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

(4)shift():删除数组的第一个元素

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

(5)案例——筛选工资

有个包含工资的数组[1500,1200,2000,2100,1800],要求把数组中工资超过2000的删除,剩余的放到新数组里面。
在这里插入图片描述

4、数组排序

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
但当此写法排序非单位数时,sort会有问题:
在这里插入图片描述
在这里插入图片描述
解决方案:(sort()的标准写法)
在这里插入图片描述

5、数组索引方法

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

案例:数组去重(重点案例)

有一个数组[ ‘c’, ‘a’, ‘z’, ‘a’, ‘x’, 'a’, ‘x’, 'c’, 'b’ l,要求去除数组中重复的元素。
①目标:
把旧数组里面不重复的元素选取出来放到新数组中,重复的元素只保留一个,放到新数组中去重。
②核心算法:
我们遍历旧数组,然后拿着旧数组元素去查询新数组,如果该元素在新数组里面没有出现过,我们就添加,否则不添加。
③我们怎么知道该元素没有存在? 利用 新数组.indexof(数组元素素)如果返回时-1就说明 新数组里面没有改元素
在这里插入图片描述

6、数组转换为字符串

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

7、其他方法

在这里插入图片描述

六、字符串对象

1、基本包装类型

· 为了方便操作基本数据类型,JavaScript还提供了三个特殊的引用类型:String、Number和Boolean。
· 基本包装类型 就是把简单数据类型包装成为复杂数据类型,这样基本数据类型就有了属性和方法。
在这里插入图片描述
按道理基本数据类型是没有属性和方法的,而对象才有属性和方法,但上面代码却可以执行,这是因为js会把基本数据类型包装为复杂数据类型,其执行过程如下:
在这里插入图片描述

2、字符串的不可变

指的是里面的值不可变,虽然看上去可以改变内容,但其实是地址变了,内存中新开辟了一个内存空间。
在这里插入图片描述

3、根据字符返回位置

字符串所有的方法,都不会修改字符串本身(字符串是不可变的),操作完成会返回一个新的字符串。
在这里插入图片描述
在这里插入图片描述

案例:返回字符位置
查找字符串"abcoefoxyozzopp"中所有o出现的位置以及次数
核心算法:
①先查找第一个o出现的位置
②然后只要indexOf返回的结果不是-1就继续往后查找
③因为indexOf只能查找到第一个,所以后面的查找,利用第二个参数,当前索引加1,从而继续查找
在这里插入图片描述

4、根据位置返回字符(重点)

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

案例

判断一个字符串’abcoefoxyozzopp中出现次数最多的字符,并统计其次数。
铺垫:
在这里插入图片描述
核心算法:
①利用charAt()遍历这个字符串
②把每个字符都存储给对象,如果对象没有该属性,就为1,如果存在了就+1
③遍历对象,得到最大值和该字符
在这里插入图片描述
在这里插入图片描述

5、字符串操作方法

在这里插入图片描述
在这里插入图片描述
其他方法:
在这里插入图片描述
在这里插入图片描述

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

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【深度学习】3-2 神经网络的学习- mini-batch学习

机器学习使用训练数据进行学习。使用训练数据进行学习&#xff0c;就是针对训练数据计算损失函数的值&#xff0c;也就是说,训练数据有100个的话&#xff0c;就要把这 100个损失函数的总和作为学习的指标。 求多个数据的损失函数&#xff0c;要求所有训练数据的损失函数的综合…

INTERSPEECH2023|达摩院语音实验室入选论文全况速览

近日&#xff0c;语音技术领域旗舰会议INTERSPEECH 2023公布了本届论文审稿结果&#xff0c;阿里巴巴达摩院语音实验室有17篇论文被大会收录。 01 论文题目&#xff1a;FunASR: A Fundamental End-to-End Speech Recognition Toolkit 论文作者&#xff1a;高志付&#xff0c;…

基于 AntV G2Plot 来实现一个 堆叠柱状图 加 折线图 的多图层案例

前言 最近研究了一下antv/g2的组合图例&#xff0c;并尝试做了一个不算太难的组合图&#xff0c;下面介绍一下整个图里的实现过程。 最终效果图 先来看一下最终的效果图 该图表有两部分组成&#xff0c;一部分是柱状图&#xff0c;准确说是堆叠的柱状图&#xff0c;一个柱…

【TA100】图形 3.5 Early-z和Z-prepass

一、深度测试&#xff1a;Depth Test 1.回顾深度测试的内容 深度测试位于渲染管线哪个位置 ○ 深度测试位于逐片元操作中、模板测试后、透明度混合前 为什么做深度测试 ● 深度测试可以解决&#xff1a;物体的可见遮挡性问题 ○ 我们可以用一个例子说明 ■ 图的解释&…

windows应急整理

windows应急整理 Virustotal 网站分析恶意样本 BrowingHistoryView 查看浏览器所有历史记录,可能会请求攻击者的恶意网站或者下载东西 启动项检查 开机启动项文件夹 msconfig 注册表run 键值查看 启动项 临时文件检查,temp 目录权限特殊,容易成为被利用对象 %temp%查看 tem…

华为HCIP第一天---------RSTP

一、介绍 1、以太网交换网络中为了进行链路备份&#xff0c;提高网络可靠性&#xff0c;通常会使用冗余链路&#xff0c;但是这也带来了网络环路的问题。网络环路会引发广播风暴和MAC地址表震荡等问题&#xff0c;导致用户通信质量差&#xff0c;甚至通信中断。为了解决交换网…

C# WebSocketSharp 框架的用法

效果: 一、概述 WebSocketSharp 是一个 C# 实现 websocket 协议客户端和服务端,WebSocketSharp 支持RFC 6455;WebSocket客户端和服务器;消息压缩扩展;安全连接;HTTP身份验证;查询字符串,起始标题和Cookie;通过HTTP代理服务器连接;.NET Framework 3.5或更高版本(包括…

腾讯云服务器云监控是什么?

腾讯云服务器云监控是什么&#xff1f;云监控用于监控云服务器性能资源指标如CPU利用率、内存使用量、内网外网出入带宽、TCP连接数、硬盘IOPS、硬盘IO等性能指标&#xff0c;云服务器吧建议免费开通云监控功能。 什么是云监控&#xff1f; 腾讯云服务器CVM云监控是什么&…

从小白到大神之路之学习运维第43天---第三阶段----LVS-----keepalived+LVS(DR)搭建部署

第三阶段基础 时 间&#xff1a;2023年6月19日 参加人&#xff1a;全班人员 内 容&#xff1a; keepalivedLVS(DR)搭建部署 目录 一、作用 技术特点&#xff1a; 与nginx的区别&#xff1a; 安全性&#xff1a; 配置文件&#xff1a; 二、环境简介 三、操作步骤 …

SPEC 2006 gcc version 8.3.0 (Uos 8.3.0.3-3+rebuild) x86_64 源码编译tools 错误处理笔记

编译tools 拷贝tools到安装目录 cp /mnt/iso/tools /opt/speccpu2006/ -r 执行编译 su rootcd /opt/speccpu2006/tools/src sh -x buildtools 错误 undefined reference to __alloca 编辑./make-3.82/glob/glob.c&#xff0c;注释掉以下宏判断 you should not run config…

unittest教程__测试报告(6)

用例执行完成后&#xff0c;执行结果默认是输出在屏幕上&#xff0c;其实我们可以把结果输出到一个文件中&#xff0c;形成测试报告。 unittest自带的测试报告是文本形式的&#xff0c;如下代码&#xff1a; import unittestif __name__ __main__:# 识别指定目录下所有以tes…

springcloud 中RestTemplate 是怎么和 ribbon整合,实现负载均衡的?源码分析

一、RestTemplate 拦截器了解 RestTemplate 内置了一个 ClientHttpRequestInterceptor,这个是一个拦截器操作,我们可以在请求的前后做一些事情。然后我们看一下这个类,这个类里面 有一个 intercept方法。我们看下这个实现类,里面有一个 LoadBalancerInterceptor实现类。 …

pm2详解

对于后台进程的管理&#xff0c;常用的工具是crontab&#xff0c;可用于两种场景&#xff1a;定时任务和常驻脚本。关于常驻脚本&#xff0c;今天介绍一款更好用的工具&#xff1a;pm2&#xff0c;基于nodejs开发的进程管理器&#xff0c;适用于后台常驻脚本管理&#xff0c;同…

whisper语音识别部署及WER评价

1.whisper部署 详细过程可以参照&#xff1a;&#x1f3e0; 创建项目文件夹 mkdir whisper cd whisper conda创建虚拟环境 conda create -n py310 python3.10 -c conda-forge -y 安装pytorch pip install --pre torch torchvision torchaudio --extra-index-url 下载whisper p…

STM32单片机LED显示屏驱动原理与实现

STM32单片机驱动LED显示屏的原理与实现方法与Arduino类似&#xff0c;但涉及到的具体硬件资源和库函数可能会有所不同。下面是一个详细的介绍&#xff1a; 原理&#xff1a; STM32单片机驱动LED显示屏的原理是通过控制GPIO引脚的电平状态来控制LED的亮灭。通过设置引脚的输出电…

Jetpack Compose中的附带效应及效应处理器

Jetpack Compose中的附带效应及效应处理器 将在任何可组合函数范围之外运行的代码称为附带效应。 为什么要编写在任何可组合函数范围之外的代码&#xff1f; 这是因为可组合项的生命周期和属性&#xff08;例如不可预测的重组&#xff09;会执行可组合项的重组。 让我们通过一…

软考高级系统架构设计师(一) 考什么

目录 一、背景 二、软考(高级)的用途 三、考什么 第一科&#xff1a;综合知识 第二科&#xff1a;案例分析 第三科&#xff1a;论文 四、系统架构设计师常见的考试内容 五、模拟与训练 一、背景 系统架构设计师&#xff0c;属于软考高级考试中的一种。 二、软考(高级)…

Node搭建前端服务Mysql数据库交互一篇搞定

目录 介绍 安装环境及数据准备 代码示例 mysql连接工具类 测试方法文件 单表总量查询 单表条件查询 新增数据 修改 删除 ​编辑 ​编辑 联表查询 联表过滤 搭配express服务搭建api使用 介绍 在前端开发中,可以使用纯node前端进行服务搭建与mysql进行数据库的交互,这样…

Bun vs. Node.js

Bun vs. Node.js 你知道 Bun 吗&#xff1f;Bun 是新的 JavaScript 运行时&#xff0c;最近在技术领域引起轰动&#xff0c;它声称比 Node.js 更好。本文将展示如何使用基准分数对其进行测试。 在本文中&#xff0c;我们将介绍最近在技术领域引起轰动的新的 Bun 运行时。我们…

螯合剂试剂:DOTA-CH2-Ph-azide(HCl salt),分子式:C21H34Cl3N7O6,的相关参数信息

文章关键词&#xff1a;双功能螯合剂&#xff0c;azide叠氮 为大家介绍&#xff08;CAS&#xff1a;N/A&#xff09;,试剂仅用于科学研究&#xff0c;不可用于人类&#xff0c;非药用&#xff0c;非食用。 分子式&#xff1a;C21H34Cl3N7O6 分子量&#xff1a;586.9 英文名称&a…