[JavaScript] 第七章 对象

作者主页：青花锁 简介：Java领域优质创作者、Java微服务架构公号作者
简历模板、学习资料、面试题库、技术互助

文末获取联系方式

系列专栏目录

[Java项目实战] 介绍Java组件安装、使用；手写框架等

[Aws服务器实战] Aws Linux服务器上操作nginx、git、JDK、Vue等

[Java微服务实战] Java 微服务实战，Spring Cloud Netflix套件、Spring Cloud Alibaba套件、Seata、gateway、shadingjdbc等实战操作

[Java基础篇] Java基础闲聊，已出HashMap、String、StringBuffer等源码分析，JVM分析，持续更新中

[Springboot篇] 从创建Springboot项目，到加载数据库、静态资源、输出RestFul接口、跨越问题解决到统一返回、全局异常处理、Swagger文档

[Spring MVC篇] 从创建Spring MVC项目，到加载数据库、静态资源、输出RestFul接口、跨越问题解决到统一返回

[华为云服务器实战] 华为云Linux服务器上操作nginx、git、JDK、Vue等，以及使用宝塔运维操作添加Html网页、部署Springboot项目/Vue项目等

[Java爬虫] 通过Java+Selenium+GoogleWebDriver 模拟真人网页操作爬取花瓣网图片、bing搜索图片等

[Vue实战] 讲解Vue3的安装、环境配置，基本语法、循环语句、生命周期、路由设置、组件、axios交互、Element-ui的使用等

[Spring] 讲解Spring(Bean)概念、IOC、AOP、集成jdbcTemplate/redis/事务等

前言

今天给大家带来JavaScript的对象知识讲解，包括对象的创建和使用、Number对象、String对象、Dom对象、Element对象、数组兑现个、Math对象等。

1、对象的创建和使用

对象看作是一个属性的无序集合，每个属性都有一个名称和值（键/值对）

1.1、创建对象

使用花括号{ }来创建对象，{ }中用来定义对象中的属性。属性是一个个键:值对的组合，其中键（属性名称）始终是字符串类型的，而值（属性值）则可以是任意类型。

var news={title:"深圳下暴雨",content:"暴雨，堵车",newsType:1,displayTitle: function(){document.write(this.title);}}

1.2、访问对象属性

console.log(news.content); console.log(news["content"]);

要访问或获取属性的值，您可以使用对象名.属性名或者对象名[“属性名”]的形式

1.3、设置修改对象属性

使用对象名.属性名或者对象名[“属性名”]的形式除了可以获取对象的属性值外，也可以用来设置或修改对象的属性值

news.title = "放晴了"; console.log(news.title);

1.4、删除对象属性

delete 语句来删除对象中的属性delete news.title; console.log('******' + news.title);

1.5、调用对象的方法

news.displayName();news["displayName"]();

2、Number对象

Infinity无穷var i = 1/0;NaN 非数字使用 isNaN() 函数可以判断一个数是否为 NaNNaN 不等于（通过 ==、!=、===、!== 比较）其它任何值（包括另外一个 NaN 值）

2.1、Number属性

2.2、Number方法

3、String对象

3.1、创建 String 对象的语法格式如下

var val = new String(value);var val = String(value);var val = "str";

3.2、属性

var str =new String('JavaScript');String.prototype.name =null;str.name ="Hello World!";

3.3、对象中的方法：

3.4、转义字符

4、dom对象

文档对象模型（Document Object Model，简称 DOM）；当浏览器加载一个 HTML 文档时，会创建一个 Document 对象，Document 对象是 DOM 树中所有节点的根节点。

4.1、dom对象中的属性

4.2、方法

5、Element 对象

Document 对象中提供的方法（例如 getElementsByTagName()、getElementById()、getElementsByClassName() 等）可以得到 Element 对象

5.1、属性

5.2、方法

6、数组对象

JavaScript的数组（Array）是一种内置的数据结构，用于在单个变量中存储多个值。它是一个容器，可以存储任意数据类型的元素，例如数字、字符串、对象，甚至其他数组。JavaScript的数组是从0开始索引的，这意味着第一个元素的索引为0，第二个元素的索引为1，依此类推。
以下是如何在JavaScript中声明和初始化数组的示例：

// 空数组var emptyArray = [];// 包含值的数组var fruits = ['apple', 'banana', 'orange'];// 不同数据类型的数组var mixedArray = [42, 'Hello', true, { name: 'John' }];// 嵌套数组var nestedArray = [[1, 2], [3, 4, 5], [6]];// 访问元素console.log(fruits[0]); // 输出：'apple'console.log(mixedArray[2]); // 输出：true// 修改元素fruits[1] = 'grape'; // 将第二个元素修改为'grape'// 数组长度console.log(fruits.length); // 输出：3// 在末尾添加元素fruits.push('pear'); // 在数组末尾添加'pear'// 从末尾删除元素var lastElement = fruits.pop(); // 删除并返回最后一个元素（'pear'）// 遍历元素for (var i = 0; i < fruits.length; i++) {console.log(fruits[i]);}

7、Math对象

JavaScript Math 数学函数及其分类

7.1、三角函数

• Math.sin(x)：正弦函数，返回 x 的正弦值。
• Math.cos(x)：余弦函数，返回 x 的余弦值。
• Math.tan(x)：正切函数，返回 x 的正切值。
  示例用法：

let x = Math.PI / 4;console.log(Math.sin(x));// 输出：0.7071067811865475console.log(Math.cos(x));// 输出：0.7071067811865476console.log(Math.tan(x));// 输出：0.9999999999999999

7.2、对数和指数函数

• Math.log(x)：自然对数函数，返回 x 的自然对数。
• Math.exp(x)：指数函数，返回 e 的 x 次幂。
  示例用法：

let x = 2;console.log(Math.log(x));// 输出：0.6931471805599453console.log(Math.exp(x));// 输出：7.3890560989306495

7.3、舍入函数

• Math.round(x)：四舍五入函数，将 x 四舍五入为最接近的整数。
• Math.ceil(x)：向上取整函数，返回大于或等于 x 的最小整数。
• Math.floor(x)：向下取整函数，返回小于或等于 x 的最大整数。
  示例用法：

let x = 3.7;console.log(Math.round(x)); // 输出：4console.log(Math.ceil(x));// 输出：4console.log(Math.floor(x)); // 输出：3

7.4、平方根和指数运算

• Math.sqrt(x)：平方根函数，返回 x 的平方根。
• Math.pow(x, y)：幂函数，返回 x 的 y 次幂。
  示例用法：

let x = 16;let y = 3;console.log(Math.sqrt(x));// 输出：4console.log(Math.pow(x, y));// 输出：4096

7.5、常量

• Math.PI：圆周率 π，约为 3.14159。
  0 Math.E：自然常数 e，约为 2.71828。
  示例用法：

console.log(Math.PI);// 输出：3.141592653589793console.log(Math.E); // 输出：2.718281828459045

联系方式

微信公众号：Java微服务架构