JavaScript 基础 - 对象

对象

对象是一种无序的数据集合,可以详细的描述描述某个事物。 注意数组是有序的数据集合。它由属性和方法两部分构成。

语法

声明一个对象类型的变量与之前声明一个数值或字符串类型的变量没有本质上的区别。

  <script>let 对象名 = {属性名:属性值,方法名:函数}</script>
属性

数据描述性的信息称为属性,如人的姓名、身高、年龄、性别等,一般是名词性的。

  1. 属性都是成 对出现的,包括属性名和值,它们之间使用英文 : 分隔

  2. 多个属性之间使用英文 , 分隔

  3. 属性就是依附在对象上的变量

  4. 属性名可以使用 ""'',一般情况下省略,除非名称遇到特殊符号如空格、中横线等

let person = {name: '小明', age: 18
}

语法: 对象名.属性   对象[‘属性’] , 单引号和双引号都可
<script>let person = {name: '小明', age: 18, stature: 185,gender: '男', };// 访问人的名字console.log(person.name) console.log(person['name']) </script>

语法: 对象名.新属性 = 新值
 <script>// 声明一个空的对象(没有任何属性)let user = {}// 动态追加属性user.name = '小明'user['age'] = 18// 动态添加与直接定义是一样的,只是语法上更灵活</script>

语法:对象名.属性 = 新值 

 <script>let user = {name:'小红'
}// 动态追加属性user.name = '小明'</script>

语法一样,判断标准就是对象有没有这个属性,没有就是新增,有就是改 

删(了解)

 语法:delete 对象名.属性

方法和调用

数据行为性的信息称为方法,如跑步、唱歌等,一般是动词性的,其本质是函数。

  1. 方法是由方法名和函数两部分构成,它们之间使用 : 分隔

  2. 多个属性之间使用英文 , 分隔

  3. 方法是依附在对象中的函数

  4. 方法名可以使用 ""'',一般情况下省略,除非名称遇到特殊符号如空格、中横线等

声明对象,并添加了若干方法后,可以使用 .[] 调用对象中函数,为方法调用。

 <script>// 方法是依附在对象上的函数let person = {name: '小红',age: 18,singing: function () {console.log('两只老虎,两只老虎,跑的快,跑的快...')},run: function () {console.log('我跑的非常快...')}}// 调用对象中 singing 方法person.singing()// 调用对象中的 run 方法person.run()
​</script>

扩展:也可以动态为对象添加方法,动态添加与直接定义是一样的,只是语法上更灵活。

 <script>// 声明一个空的对象(没有任何属性,也没有任何方法)let user = {}// 动态追加属性user.name = '小明'user.['age'] = 18// 动态添加方法user.move = function () {console.log('移动一点距离...')}</script>

注:无论是属性或是方法,同一个对象中出现名称一样的,后面的会覆盖前面的。

null

null 也是 JavaScript 中数据类型的一种,通常只用它来表示不存在的对象。使用 typeof 检测类型它的类型时,结果为 object

遍历对象
目标:能够遍历输出对象里面的元素
for 遍历对象的问题:
对象没有像数组一样的length属性,所以无法确定长度
对象里面是无序的键值对, 没有规律. 不像数组里面有规律的下标
let obj = {uname: 'pink'
}
for(let k in obj) {// k 属性名  字符串  带引号    obj.'uname'     k ===  'uname'// obj[k]  属性值    obj['uname']   obj[k]
}

for in 不提倡遍历数组 因为 k 是 字符串

k 是获得对象的 属性名 对象名[k] 是获得 属性值

内置对象

Math

Math 是 JavaScript 中内置的对象,称为数学对象,这个对象下即包含了属性,也包含了许多的方法。提供了一系列做数学运算的方法。

属性
  • Math.PI,获取圆周率

// 圆周率
console.log(Math.PI);
方法
  • Math.random,生成 0 到 1 间的随机数  [ 0,1)

// 0 ~ 1 之间的随机数, 包含 0 不包含 1
Math.random()

    生成0-10之间的随机数

Math.floor(Math.random() * (10 + 1))

 

     生成N-M之间的随机数

Math.floor(Math.random() * (M - N + 1)) + N

 

  • Math.ceil,数字向上取整

// 舍弃小数部分,整数部分加1
Math.ceil(3.4)
  • Math.floor,数字向下取整

// 舍弃小数部分,整数部分不变
Math.floor(4.68)
  • Math.round,四舍五入取整

// 取整,四舍五入原则
Math.round(5.46539)
Math.round(4.849)
  • Math.max,在一组数中找出最大的

// 找出最大值
Math.max(10, 21, 7, 24, 13)
  • Math.min,在一组数中找出最小的

// 找出最小值
Math.min(24, 18, 6, 19, 21)
  • Math.pow,幂方法

// 求某个数的多少次方
Math.pow(4, 2) // 求 4 的 2 次方
Math.pow(2, 3) // 求 2 的 3 次方
  • Math.sqrt,平方根

// 求某数的平方根
Math.sqrt(16)

数学对象提供了比较多的方法,这里不要求强记,通过演示数学对象的使用,加深对对象的理解。

随机颜色案例

<body><script>function getRandomColor(flag = true) {//该函数接收一个布尔类型参数,表示颜色的格式是十六进制还是rgb格式if (flag) {let str = '#'let arr = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'a', 'b', 'c', 'd', 'e', 'f']for (let i = 1; i <= 6; i++) {let random = Math.floor(Math.random() * arr.length)str += arr[random]}return str//如果参数为true或者无参数,则处理16进制颜色,核心思想是循环6次,生成随机的6个数字(取 值范围0~15),根据这个数字去找数组的值,然后和 # 拼接起来,并且返回值。} else {let r = Math.floor(Math.random() * 256)let g = Math.floor(Math.random() * 256)let b = Math.floor(Math.random() * 256)return `rgb(${r},${g},${b})`//如果参数为false,随机生成一个0~255的数给三个变量,分别作为 r g b 三个颜色,之后拼接字 符串rgb(255,255,255)格式}}console.log(getRandomColor(true))console.log(getRandomColor(false))console.log(getRandomColor())</script>
</body>

 

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

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

相关文章

accelerate笔记:实验跟踪

Accelerate支持七种集成的跟踪器&#xff1a; TensorBoardWandBCometMLAimMLFlowClearMLDVCLive要使用这些跟踪器&#xff0c;可以通过在 Accelerator 类的 log_with 参数中传入所选类型来实现 from accelerate import Accelerator from accelerate.utils import LoggerTypeac…

高通开发系列 - ubuntu中的docker安装debian镜像

By: fulinux E-mail: fulinux@sina.com Blog: https://blog.csdn.net/fulinus 喜欢的盆友欢迎点赞和订阅! 你的喜欢就是我写作的动力! 返回:专栏总目录 目录 概述当前状态Ubuntu中安装dockerDebian镜像Debian容器中操作更改Debian源安装应用程序

28 _ WebComponent:像搭积木一样构建Web应用

在上一篇文章中我们从技术演变的角度介绍了PWA&#xff0c;这是一套集合了多种技术的理念&#xff0c;让浏览器渐进式适应设备端。今天我们要站在开发者和项目角度来聊聊WebComponent&#xff0c;同样它也是一套技术的组合&#xff0c;能提供给开发者组件化开发的能力。 那什么…

python 各种画图(2D 3D)-1 _matplotlib 官方网站笔记

背景 需利用python进行3D可视化处理&#xff0c;用于分析python得到的数据的正确性。 知识学习 python高阶3D绘图---pyvista模块&#xff0c;mayavi模块&#xff0c;pyopengl模块&#xff0c;MoviePy模块基础使用-CSDN博客 python用于3D绘图的模块比较多&#xff0c;pyvist…

目标2亿欧元!四年两次募资,全球最早专注于量子投资的Quantonation再次加码

Quantonation Ventures 是全球第一家专注于深度物理和量子技术的早期风险投资公司。4月10日&#xff0c;该公司宣布其第二只专门用于量子技术的早期基金 Quantonation II 首次募资完成&#xff0c;目前已募资 7000 万欧元&#xff0c;而目标为 2 亿欧元。 首次募资就募到了将…

《QT从基础到进阶·四十一》无法解析的外部符号及生成事件加入QT打包命令报错问题

其他无法解析的外部符号&#xff1a; 无法解析的外部符号 "public: virtual struct QMetaObject const * __cdecl ML_AddinManger::metaObject(void)const "… 无法解析的外部符号 “public: virtual void * __cdecl ML_AddinManger::qt_metacast(char const *)” (?…

toefl listening_托福听力

x.1 课程介绍 x.1.1 课程介绍 考试介绍 注意事项如下&#xff0c; x.1.2 分数设定和方法论 x.2.1 细节题解法 x.2.2 对话主旨题解法 听力对话不要扣分&#xff1b; 内容主旨题&#xff0c;以what开头&#xff1b; 目的主旨题&#xff0c;以why开头&#xff1b; 目的主旨题…

SpringCloud中注册中心Nacos的下载与使用步骤

1.前言 Nacos&#xff08;Dynamic Naming and Configuration Service&#xff09;是阿里巴巴开源的一款服务发现和配置管理工具。它可以帮助用户自动化地进行服务注册、发现和配置管理&#xff0c;是面向微服务架构的一个重要组成部分。 2.下载 链接&#xff1a;https://pan.b…

奶茶店、女装店、餐饮店是高危创业方向,原因如下:

关注卢松松&#xff0c;会经常给你分享一些我的经验和观点。 现在的俊男靓女们&#xff0c;心中都有一个执念&#xff1a; (1)想证明自己了&#xff0c;开个奶茶去…… (2)想多赚点钱了&#xff0c;加盟餐饮店去…… (3)工作不顺心了&#xff0c;搞个女装店去…… 但凡抱着…

回溯--字母迷宫

1.题目描述 字母迷宫游戏初始界面记作 m x n 二维字符串数组 grid&#xff0c;请判断玩家是否能在 grid 中找到目标单词 target。 注意&#xff1a;寻找单词时 必须 按照字母顺序&#xff0c;通过水平或垂直方向相邻的单元格内的字母构成&#xff0c;同时&#xff0c;同一个单…

Windows系统下DOS命令

Windows系统下DOS命令 1. 与文件操作相关1.1 mkdir&#xff0c;md命令1.2 rmdir、rd命令1.3 dir命令1.4 start命令1.5 echo命令1.6 type命令1.7 copy命令1.8 move命令1.9 copy和move的区别1.10 del命令1.11 rename命令1.12 attrib命令1.13 fsutil命令1.14 assoc命令 2. 与网络相…

数据持久化第六课-ASP.NET运行机制

数据持久化第六课-ASP.NET运行机制 一.预习笔记 1.动态网页的工作机制通常分为以下几个阶段&#xff1a; 1&#xff09;使用动态Web开发技术编写Web应用程序&#xff0c;并部署到Web服务器。 2&#xff09;客户端通过在浏览器中输入地址&#xff0c;请求动态页面。 3&#…

机器学习之数学基础(六)~时间复杂度和空间复杂度

目录 算法背景 background 1. 时间复杂度 Time Complexity 1.1 时间复杂度分类 1.1.1 O(1) 常数阶 1.1.2 O(n) 线性阶 1.1.3 O(n^2) 平方阶 1.1.4 O(logn) 对数阶 1.1.5 O(nlogn) 线性对数阶 1.1.6 O(2^n) 指数阶 1.1.7 O(n!) 阶乘阶 1.1.8 时间复杂度分类 1.2 时…

03-07Java自动化之JAVA基础之循环

JAVA基础之循环 一、for循环 1.1for循环的含义 for&#xff08;初始化语句;条件判断;条件控制或–&#xff09;{ ​ //代码语句 } 1、首先执行初始话语句&#xff0c;给变量一个起始的值 2、条件判断进行判断&#xff0c;为true&#xff0c;执行循环体中的代码语句 ​ …

3DGS语义分割之LangSplat

LangSplat是CVPR2024的paper. 实现3DGS的语义分割&#xff08;可文本检索语义&#xff09; github: https://github.com/minghanqin/LangSplat?tabreadme-ov-file 主要思想是在3DGS中加入了CLIP的降维语义特征&#xff0c;可用文本检索目标&#xff0c;实现分割。 配置环境&…

网线水晶头为什么要按标准线序打

网线接水晶头为什么要按照线序接&#xff1f; 减少串扰和增强信号质量&#xff1a; 双绞线的设计是为了减少信号间的串扰&#xff08; Crosstalk&#xff09;&#xff0c;每一对线芯在传输过程中通过相互扭绞抵消外部电磁干扰。按照标准线序接线能够确保每一对线芯之间的信号传…

Ubuntu server 24 (Linux) 安装部署smartdns 搭建智能DNS服务器

SmartDNS是推荐本地运行的DNS服务器&#xff0c;SmartDNS接受本地客户端的DNS查询请求&#xff0c;从多个上游DNS服务器获取DNS查询结果&#xff0c;并将访问速度最快的结果返回给客户端&#xff0c;提高网络访问速度和准确性。 支持指定域名IP地址&#xff0c;达到禁止过滤的效…

Pinia的介绍、使用及持久化

Pinia介绍 什么是Pinia&#xff1f; Pinia 是 Vue 的最新 状态管理工具&#xff0c;状态就是数据。 通俗地讲&#xff1a;Pinia 是一个插件&#xff0c;可以帮我们管理 vue 通用的数据 (多组件共享的数据)。 比如一份数据有多个组件需要使用&#xff0c;在学Pinia之前我们需…

Accelerate 笔记:保存与加载文件

保存和加载模型、优化器、随机数生成器和 GradScaler 使用 save_state() 将上述所有内容保存到一个文件夹位置使用 load_state() 加载之前通过 save_state() 保存的状态通过使用 register_for_checkpointing()&#xff0c;可以注册自定义对象以便自动从前两个函数中存储或加载 …

vue3+electron+typescript 项目安装、打包、多平台踩坑记录-mac+linux(包括国产化系统)

上一章《vue3electrontypescript 项目安装、打包、多平台踩坑记录》&#xff0c;我们讲了vue3electrontypescript的项目安装和windows 32位、64位的打包。这一节我们来看下mac和linux平台的打包和一些坑。 mac 经过上一章我们的踩坑后&#xff0c;再到mac环境&#xff0c;这里…