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

javaScript语法基础(函数,对象,常用类Array,String,Math和Date)

  • # 本文详细结束了JavaScript中函数、对象、常用类Array,String,MathDate的用法。

一、函数

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&#xff0c;String&#xff0c;Math和Date的用法。 一、函数 1、概述 将程序中多次要用到的代码块封装起来&#xff0c;就是函数。函数使代码块的重复使用更方便&#xff0c;且功能独立&#xff0c;便于维护。 2、函数的…...

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

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

k8s-NetworkPolicy

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

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

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

C++——智能指针剖析

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

241119.LeetCode——383.赎金信

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

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

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

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

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

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

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

【vulhub】nginx解析漏洞(nginx_parsing_vulnerability)

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

网络协议之邮件协议(SMTP、POP3与IMAP)

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

python学习笔记(3)运算符

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

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

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

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

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

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

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

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

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

维护在线重做日志

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

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

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

Python入门(10)--面向对象进阶

Python面向对象进阶 &#x1f680; 1. 继承与多态 &#x1f504; 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…...

Makefile 之 自动化变量

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

19c补丁后oracle属主变化,导致不能识别磁盘组

补丁后服务器重启&#xff0c;数据库再次无法启动 ORA01017: invalid username/password; logon denied Oracle 19c 在打上 19.23 或以上补丁版本后&#xff0c;存在与用户组权限相关的问题。具体表现为&#xff0c;Oracle 实例的运行用户&#xff08;oracle&#xff09;和集…...

《从零掌握MIPI CSI-2: 协议精解与FPGA摄像头开发实战》-- CSI-2 协议详细解析 (一)

CSI-2 协议详细解析 (一&#xff09; 1. CSI-2层定义&#xff08;CSI-2 Layer Definitions&#xff09; 分层结构 &#xff1a;CSI-2协议分为6层&#xff1a; 物理层&#xff08;PHY Layer&#xff09; &#xff1a; 定义电气特性、时钟机制和传输介质&#xff08;导线&#…...

【SQL学习笔记1】增删改查+多表连接全解析(内附SQL免费在线练习工具)

可以使用Sqliteviz这个网站免费编写sql语句&#xff0c;它能够让用户直接在浏览器内练习SQL的语法&#xff0c;不需要安装任何软件。 链接如下&#xff1a; sqliteviz 注意&#xff1a; 在转写SQL语法时&#xff0c;关键字之间有一个特定的顺序&#xff0c;这个顺序会影响到…...

[10-3]软件I2C读写MPU6050 江协科技学习笔记(16个知识点)

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16...

SpringBoot+uniapp 的 Champion 俱乐部微信小程序设计与实现,论文初版实现

摘要 本论文旨在设计并实现基于 SpringBoot 和 uniapp 的 Champion 俱乐部微信小程序&#xff0c;以满足俱乐部线上活动推广、会员管理、社交互动等需求。通过 SpringBoot 搭建后端服务&#xff0c;提供稳定高效的数据处理与业务逻辑支持&#xff1b;利用 uniapp 实现跨平台前…...

12.找到字符串中所有字母异位词

&#x1f9e0; 题目解析 题目描述&#xff1a; 给定两个字符串 s 和 p&#xff0c;找出 s 中所有 p 的字母异位词的起始索引。 返回的答案以数组形式表示。 字母异位词定义&#xff1a; 若两个字符串包含的字符种类和出现次数完全相同&#xff0c;顺序无所谓&#xff0c;则互为…...

Caliper 配置文件解析:config.yaml

Caliper 是一个区块链性能基准测试工具,用于评估不同区块链平台的性能。下面我将详细解释你提供的 fisco-bcos.json 文件结构,并说明它与 config.yaml 文件的关系。 fisco-bcos.json 文件解析 这个文件是针对 FISCO-BCOS 区块链网络的 Caliper 配置文件,主要包含以下几个部…...

Python+ZeroMQ实战:智能车辆状态监控与模拟模式自动切换

目录 关键点 技术实现1 技术实现2 摘要&#xff1a; 本文将介绍如何利用Python和ZeroMQ消息队列构建一个智能车辆状态监控系统。系统能够根据时间策略自动切换驾驶模式&#xff08;自动驾驶、人工驾驶、远程驾驶、主动安全&#xff09;&#xff0c;并通过实时消息推送更新车…...

苹果AI眼镜:从“工具”到“社交姿态”的范式革命——重新定义AI交互入口的未来机会

在2025年的AI硬件浪潮中,苹果AI眼镜(Apple Glasses)正在引发一场关于“人机交互形态”的深度思考。它并非简单地替代AirPods或Apple Watch,而是开辟了一个全新的、日常可接受的AI入口。其核心价值不在于功能的堆叠,而在于如何通过形态设计打破社交壁垒,成为用户“全天佩戴…...

区块链技术概述

区块链技术是一种去中心化、分布式账本技术&#xff0c;通过密码学、共识机制和智能合约等核心组件&#xff0c;实现数据不可篡改、透明可追溯的系统。 一、核心技术 1. 去中心化 特点&#xff1a;数据存储在网络中的多个节点&#xff08;计算机&#xff09;&#xff0c;而非…...