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

javaScript语法基础（函数，对象，常用类Array，String，Math和Date）

news 2025/12/17 11:52:11

# 本文详细结束了JavaScript中函数、对象、常用类Array，String，Math和Date的用法。

一、函数

1、概述

将程序中多次要用到的代码块封装起来，就是函数。
函数使代码块的重复使用更方便，且功能独立，便于维护。

2、函数的定义与使用

①. 简介

函数可以使用参数来传递数据，也可以不使用参数。
函数在完成功能后可以有返回值，也可以没有返回值。

function 函数名(参数1,参数2…)
{函数体；return 返回值;  
}function 函数名(参数1,参数2…)
{语句；......return 表达式;  //return语句指明被返回的值
}

②. 函数的使用

<!DOCTYPE html>
<html lang="zh">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>JS的函数</title>
</head>
<body><script>function calculator(a, b){var c = a+b;return c;        }var result = calculator(1,1);console.log("result =" +result);</script>
</body>
</html>

代码运行后如下：

③.在JS程序中被调用（包括有返回值和无返回值的调用）

<!DOCTYPE html>
<html lang="zh">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>JS的函数</title>
</head>
<body><script>function calculator(a, b){c = a+b;alert("a+b=" + c); return c;        }var result = calculator(1,1);console.log("result =" +result);// 1. 在JS程序中被调用 （包括有返回值和无返回值的调用）console.log("a+b=" + c)</script></body>
</html>

代码运行后如下：

3、监听点击事件

①.在按钮被点击时调用

<!DOCTYPE html>
<html lang="zh">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>JS的函数</title>
</head>
<body><script>function calculator(a, b){c = a+b;alert("a+b=" + c); return c;        }</script><!-- 2. 在按钮或超链接被点击时调用（监听点击事件） --><!-- 2.1 监听按钮点击 --><input type="submit" value="计算a+b的和" onclick="calculator(1,2)"/></body>
</html>

代码运行后如下：

②.在超链接被点击时调用

<!DOCTYPE html>
<html lang="zh">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>JS的函数</title>
</head>
<body><script>function calculator(a, b){c = a+b;alert("a+b=" + c); return c;        }</script><!-- 2.2 监听超链接点击 --><a href="#" onclick="calculator(3,4)">百度一下，你就知道</a>
</body>
</html>

代码运行后如下：

4、变量

变量的作用域：变量分为全局变量和局部变量。全局变量定义在所有函数之外，作用范围是所有函数；局部变量定义在函数之内，只对该函数可见，对其它函数不可见。

全局变量和局部变量的运用

<!DOCTYPE html>
<html lang="zh">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>JS的函数</title>
</head>
<body><script>var c=1;  //全局变量，既可以作用于所有函数内，又可以作用于函数外function calculator1(a,b){   var d=2;     //局部变量，只作用与函数内return (a+b+c)*d;  //返回6}rlt1 = calculator1(1,1)console.log("计算结果为:" + rlt1)rlt2 = (1+1+c)*d      //函数外无法调用局部变量d，控制台报错 console.log("计算结果为:" + rlt2)</script></body>
</html>

代码运行后如下：

二、对象

1、概述

对象（object）是 JavaScript 中最重要的数据类型，
是一组“键值对”的集合体。类似Python中的字典。
其中，键可以为变量名（此时称为对象的属性）和函数名（此时称为对象的方法）

2、对象的定义和使用

定义一个对象（类似于python里面的类，其结构是键值对）
使用一个对象的属性和方法

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>js的对象</title>
</head>
<body><script>// 1.定义一个对象（类似于python里面的类，其结构是键值对）var person={age:18,sex:"female_",calculator:function(a,b){return a+b;}}// 2.使用一个对象的属性和方法console.log(person.age)  //使用对象的属性console.log(person.calculator(1,1))//使用对象的方法</script>
</body>
</html>

代码运行后如下：

3、js的常用对象

①.Array对象

1.根据Array对象，得到一个对应的数组实例和往数组里面添加一个新的元素（入栈）

<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>js的常用对象</title>
</head>
<body><script>//1.根据Array对象，得到一个对应的数组实例//var arr= new Array("john","tom","joe");var arr= new Array("11","22","33");//2.往数组里面添加一个新的元素（入栈）length = arr.push("zhangsan")  //返回数组的长度for(const i in arr ){console.log(arr[i]);}</script>
</body>
</html>

代码运行后如下：

2.颠倒数组元素

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>js的常用对象</title>
</head>
<body><script>//1.根据Array对象，得到一个对应的数组实例var arr= new Array("11","22","33");length = arr.push("zhangsan")//4.颠倒数组元素console.log(arr.reverse());</body>
</html>

代码运行后如下：

3.获取数组中某个元素的索引

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>js的常用对象</title>
</head>
<body><script>//1.根据Array对象，得到一个对应的数组实例var arr= new Array("11","22","33");length = arr.push("zhangsan")//5.获取数组中某个元素的索引console.log(arr.indexOf("11"));console.log(arr.indexOf("33"));</body>
</html>

代码运行后如下：

②.String类

1.定义一个字符串

var str = new String("我爱北京天安门")

2.获取字符串的长度

len = srt.length
console.log(`字符串长度为:${len}`);

3.返回指定索引的字符（索引不能为负数）

 var i= 1ch = str.charAt(1)console.log (`索引${i}对应字符为：${ch}`);var a =  "aaa"var b = "bbb"var c = "ccc"

4.concat 用于顺序连接多个字符串，返回一个新字符串

 var d = a+b+cvar d = a.concat(b,c,e)console.log(d);

5.获取某个字符索引

console.log(str.indexOf("爱"));

6.按照指定规则分割字符串

var str = "aaa  bbb  ccc"
console.log(str.split("b"))

③.Math类

1.abs方法返回参数值的绝对值

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>js的内置对象Math</title>
</head>
<body><script>//1.abs方法返回参数值的绝对值console.log(Math.abs(1)) //1console.log(Math.abs(-1))//1</script>
</body>
</html>

代码运行后如下：

2.max和min方法返回参数值的最大值和最小值

        //2.max和min方法返回参数值的最大值和最小值console.log(Math.max(1,2,3))//3console.log(Math.min(1,2,3))//1

代码运行后如下：

3..random返回[0,1]之间的一个伪随机数

//4.random返回[0,1]之间的一个伪随机数for(var index = 1;index <=5; index++){console.log(Math.random())}

代码运行后如下：

④.Date类

//创建一个新的Date 实例，表示当前日期和时间const now = new Date();
//获取年份（四位数的年份，比如2024）const year = now.getFullYear();

javaScript语法基础（函数，对象，常用类Array，String，Math和Date）

# 本文详细结束了JavaScript中函数、对象、常用类Array，String，Math和Date的用法。一、函数 1、概述将程序中多次要用到的代码块封装起来，就是函数。函数使代码块的重复使用更方便，且功能独立，便于维护。 2、函数的…...

编程日记 2024/11/21 5:50:26

WebStorm 2022.3.2/IntelliJ IDEA 2024.3出现elementUI提示未知 HTML 标记、组件引用爆红等问题处理

WebStorm 2022.3.2/IntelliJ IDEA 2024.3出现elementUI提示未知 HTML 标记、组件引用爆红等问题处理 1. 标题识别elementUI组件爆红这个原因是： 在官网说明里，才版本2024.1开始，默认启用的 Vue Language Server，但是在 Vue 2 项…...

编程日记 2024/11/21 5:49:22

k8s-NetworkPolicy

NetworkPolicy 是k8s中的网络策略可以限制pod以及namespace之间的访问流量演示一下名称空间之间基于端口的访问限制官方对networkpolicy的介绍官方网址： 网络策略 |Kubernetes （简体中文） 一：创建NetworkPolicy vim…...

编程日记 2024/11/21 5:48:21

【C++】踏上C++学习之旅（九）：深入“类和对象“世界，掌握编程的黄金法则（四）（包含四大默认成员函数的练习以及const对象）

文章目录前言1. 实现Date类的构造函数2. 实现Date类的拷贝构造函数3. 实现Date类的赋值运算符重载4. 实现各Date对象之间的比较接口5. 实现Date对象的加减接口6. const成员7. 取地址及const取地址操作符重载前言在我们前面学习到了"类和对象"的四大默认成员函数(…...

编程日记 2024/11/21 5:47:19

C++——智能指针剖析

参考： 恋恋风辰官方博客动态内存管理 - cppreference.com SRombauts/shared_ptr： 一个最小的 shared/unique_ptr 实现，用于处理 boost/std：：shared/unique_ptr 不可用的情况。 C智能指针_c 智能指针-CSDN博客当…...

编程日记 2024/11/21 5:45:16

241119.LeetCode——383.赎金信

题目描述给你两个字符串：ransomNote 和 magazine ，判断 ransomNote 能不能由 magazine 里面的字符构成。如果可以，返回 true ；否则返回 false 。 magazine 中的每个字符只能在 ransomNote 中使用一次。示例 1： 输…...

编程日记 2024/11/21 5:44:15

基于SSM的农家乐管理系统+论文示例参考

1.项目介绍功能模块：管理员（农家乐管理、美食信息管理、住宿信息管理、活动信息、用户管理、活动报名、论坛等），普通用户（注册登录、活动报名、客房预订、用户评价、收藏管理、模拟支付等）技术选型&#…...

编程日记 2024/11/21 5:41:11

用 Python 从零开始创建神经网络（九）：反向传播（Backpropagation）（还在更新中。。。）

反向传播（Backpropagation） 引言1. 分类交叉熵损失导数（Categorical Cross-Entropy loss derivative）2. 分类交叉熵损失衍生代码实现3. Softmax激活导数（Softmax activation derivative）4. Softmax激活函数…...

编程日记 2024/11/21 5:40:09

Flink是如何实现 End-To-End Exactly-once的？

flink 如何实现端到端的 Exactly-once? 端到端包含 Source, Transformation,Sink 三部分的Exactly-once Source：支持数据的replay，如Kafka的offset。Transformation：借助于checkpointSink：Checkpoint 两阶段事务提交两阶段提…...

编程日记 2024/11/21 5:39:06

【vulhub】nginx解析漏洞(nginx_parsing_vulnerability)

1. nginx解析漏洞原理 fastcgi 在处理’.php’文件时发现文件并不存在,这时 php.ini 配置文件中cgi.fix_pathinfo1 发挥作用,这项配置用于修复路径,如果当前路径不存在则采用上层路径 (1)由于 nginx.conf的配置导致 nginx把以’.php”结尾的文件交给 fastcgi 处理,为此可以构造…...

编程日记 2024/11/21 5:38:05

网络协议之邮件协议（SMTP、POP3与IMAP）

一、引言在数字化时代，电子邮件已成为人们日常沟通和信息交流的重要工具。电子邮件系统的稳定运行离不开一系列网络协议的支撑，其中SMTP、POP3和IMAP是最为关键的三个协议。它们分别负责邮件的发送、接收和管理，共同构建了一个高效、稳定的…...

编程日记 2024/11/21 5:37:04

python学习笔记（3）运算符

Python 语言支持的运算符: Python 语言支持以下类型的运算符: 算术运算符比较（关系）运算符赋值运算符逻辑运算符位运算符成员运算符身份运算符运算符优先级接下来让我们一个个来学习Python的运算符。 Python算术运算符运算符描述实例加 - 两…...

编程日记 2024/11/21 5:36:02

_FYAW智能显示控制仪表的简单使用_串口通信

一、简介该仪表可以实时显示位移传感器的测量值，并可设定阈值等。先谈谈简单的使用方法，通过说明书，我们可以知道长按SET键可以进入参数选择状态，按“↑”“↓”可以选择该组参数的上一个或者下一个参数。从参数一览中可以看到有…...

编程日记 2024/11/21 5:35:01

激光雷达定位初始化的另外一个方案通过键盘按键移动当前位姿（附python代码）

通常使用的是通过在 rviz 中点选指定初始化位置和方向来完成点云的初始化匹配。但是这种粗略的初始化方法有时候可能不成功，因此需要使用准确的初始化方法，以更好的初始值进行无损检测配准。为了提供更好的匹配初始值，我使用 Python 脚本获取键盘输入，并不断调整这个匹配…...

编程日记 2024/11/21 5:33:59

从0-1逐步搭建一个前端脚手架工具并发布到npm

前言 vue-cli 和 create-react-app 等 cli 脚手架工具用于快速搭建应用，无需手动配置复杂的构建环境。本文介绍如何使用 rollup 搭建一个脚手架工具。脚手架工具的工作流程简言为：提供远端仓库各种模版 > 用户通过命令选择模版 > 拉取仓库代码 …...

编程日记 2024/11/21 5:32:58

河道水位流量一体化自动监测系统：航运安全的护航使者

在广袤的水域世界中，航运安全始终是至关重要的课题。而河道水位流量一体化自动监测系统的出现，如同一位强大的护航使者，为航运事业的稳定发展提供了坚实的保障。水位传感器：负责实时监测河道的水位变化。这些传感器通常采用先进的…...

编程日记 2024/11/21 5:30:55

维护在线重做日志

学习目标解释在线重做日志文件的目的概述在线重做日志文件的结构控制日志开关和检查点多路复用和维护在线重做日志文件使用OMF管理在线重做日志文件获取在线重做日志文件信息在线重做日志文件提供了在数据库发生故障时重做事务的方法。每个事务都同步写入重做日志缓冲区&a…...

编程日记 2024/11/21 5:29:54

ASCB1系列APP操控末端回路智能微断物联网断路器远程控制开关学校、工厂、农场、商业大楼等可用

安科瑞戴婷 Acrel-Fanny ASCB1系列智能微型断路器是安科瑞电气股份有限公司全新推出的智慧用电产品，产品由智能微型断路器与智能网关两部分组成，可用于对用电线路的关键电气因素，如电压、电流、功率、温度、漏电、能耗等进行实时监测&#x…...

编程日记 2024/11/21 5:28:52

Python面向对象进阶 🚀 1. 继承与多态 🔄 1.1 继承基础 class Animal:def __init__(self, name, age):self.name nameself.age agedef speak(self):passdef describe(self):return f"{self.name} is {self.age} years old"class Dog(Anim…...

编程日记 2024/11/21 5:27:51

Makefile 之自动化变量

作用范围只在这条规则以及连带规则中，所以其值也只在作用范围内有效。而不会影响规则链以外的全局变量的值。 "$" 表示目标的集合，就像一个数组，"$"依次取出目标，并执于命令。 "$<"和"$&qu…...

编程日记 2024/11/21 5:26:50

业务系统对接大模型的基础方案：架构设计与关键步骤

业务系统对接大模型：架构设计与关键步骤在当今数字化转型的浪潮中，大语言模型（LLM）已成为企业提升业务效率和创新能力的关键技术之一。将大模型集成到业务系统中，不仅可以优化用户体验，还能为业务决策提供…...

编程新知 2025/12/16 13:42:29

【Python】 -- 趣味代码 - 小恐龙游戏

文章目录文章目录 00 小恐龙游戏程序设计框架代码结构和功能游戏流程总结01 小恐龙游戏程序设计02 百度网盘地址00 小恐龙游戏程序设计框架这段代码是一个基于 Pygame 的简易跑酷游戏的完整实现，玩家控制一个角色（龙）躲避障碍物（仙人掌和乌鸦）。以下是代码的详细介绍：…...

编程新知 2025/12/7 13:42:04

Python爬虫（二）：爬虫完整流程

爬虫完整流程详解（7大核心步骤实战技巧） 一、爬虫完整工作流程以下是爬虫开发的完整流程，我将结合具体技术点和实战经验展开说明： 1. 目标分析与前期准备网站技术分析： 使用浏览器开发者工具（F12&…...

编程新知 2025/10/19 5:48:51

selenium学习实战【Python爬虫】

selenium学习实战【Python爬虫】文章目录 selenium学习实战【Python爬虫】一、声明二、学习目标三、安装依赖3.1 安装selenium库3.2 安装浏览器驱动3.2.1 查看Edge版本3.2.2 驱动安装四、代码讲解4.1 配置浏览器4.2 加载更多4.3 寻找内容4.4 完整代码五、报告文件爬取5.1 提…...

编程新知 2025/12/13 10:57:35