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

JavaScript（1）

news 2026/3/26 23:34:27

JavaScript简介

JavaScript是一门跨平台、面向对象的脚本语言，用来控制网页行为的，它能使网页可以交互。

JavaScript引入方式

1、内部脚本

将js代码定义在HTML页面中，在HTML中，JavaScript代码必须位于<script>与</script>标签之间

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Document</title>
</head>
<body><script>alert("hello js~");</script>
</body>
</html>

提示：

  • 在HTML文档中可以在任意位置放置任意数量的<script>标签
  • 一般把脚本置于<body>元素底部，可以改善显示速度，因为脚本执行会拖慢显示

2、外部脚本

将js代码定义在外部js文件中，然后引入到HTML页面中

  • 外部文件demo.js
alert("Hello JS~");
  • 引入外部js文件
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Document</title><script src="./js/demo.js"></script>
</head>
<body></body>
</html>

注意：
1、对于一个<script>，不能同时引入JS文件和在内部书写JS代码
2、外部脚本JS文件中不能包含<script>标签

书写语法

  1. 区分大小写：与Java一样，变量名、函数名以及其他一切东西都是区分大小写的
  2. 每行结尾的分号可有可无
  3. 注释：单行注释（//）、多行注释（/* */）
  4. 大括号表示代码块

输出语句

  • 使用window.alert()写出警告框
  • 使用document.write()写入HTML输出
  • 使用console.log()写入浏览器控制台
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Document</title>
</head>
<body><script>window.alert("hello JS~");//弹出警告框document.write("hello JS~");//写入HTML(网页显示)console.log("hello JS~");//写入控制台(开发者模式)</script>
</body>
</html>

JavaScript基本语法

一、变量

JS本身是一门弱类型语言，只需要使用var关键字即可，不需要指定数据类型。
语法：var 变量名; 或者var 变量名1,变量名2; 或者var 变量名=值;
在这里插入图片描述

二、数据类型

分为两类：基本数据类型和引用数据类型
在这里插入图片描述

引用数据类型：通常叫做类（class），JS会将之转换成对象来处理

使用typeof运算符可以获取数据类型

alert(typeof age);

三、运算符

算数运算符：+ - * / % ++ –

赋值运算符：= += -= *= /= %=

关系运算符： === ，>， >=， <， <=， ==， !=

逻辑运算符：&& || !

条件运算符：条件表达式 ? true_value : false_value

注意：
在这里插入图片描述
类型转换：
在这里插入图片描述
在这里插入图片描述

四、流程控制语句

分支结构：单分支：if(){}、双分支：if(){}else{}、多分支：if(){}else if(){}else{}、等值多分支：switch(){case :……break;default:……}

循环结构：JS中while循环，do while循环，for循环跟Java基本一致。增强型for循环略有差别。

 //增强型for循环//java:for（数据类型 变量:数组名）{}for(var i in array) {console.log(i)//打印的还是索引console.log(array[i]);}

五、日期对象

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>日期对象</title>
</head>
<body><script>var now = new Date;console.log(now);//Thu Mar 02 2023 19:48:29 GMT+0800 (GMT+08:00)//日期格式转换console.log(now.toLocaleDateString());//2023/3/2console.log(now.toLocaleString());//2023/3/2 19:52:14console.log(now.toLocaleTimeString());//19:52:14var year = now.getFullYear();var month = now.getMonth()+1;var date = now.getDate();var hour = now.getHours();var minute = now.getMinutes();var second = now.getSeconds();var week = now.getDay();var time = year+"年"+month+"月"+date+"日 星期"+week+" "+hour+"："+minute+"："+second;console.log(time);//2023年3月2日 星期4 19：55：40</script>
</body>
</html>

六、函数对象

JavaScript函数通过function关键字进行定义

语法为：

<script>function functionName(参数1,参数2...){要执行的代码}
</script>

注意：
1、形参不需要类型，应为JS是弱类型语言
2、返回值也不需要定义类型，可以在函数内部直接使用return返回即可

function sum(){var a = 4,b = 7;var res = a + b;return res;
}

调用：函数名称(实际参数列表)；

七、数组对象

Array对象用于定义数组：
在这里插入图片描述
在这里插入图片描述

代码演示：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Document</title><script>//1）创建空数组var array1 = new Array();//2）创建有长度的数组var array2 = new Array(5);//3）创建有初始值的数组var array3 = [2,1.23,true,"abc"];//获取数组的长度//console.log(array3.length);//遍历数组数据for (var i = 0;i < array3.length;i ++) {//console.log(array3[i]);}//console.log(array3[8]);//array3[8] = "陈微";//alert(array3);//增强型for循环//java:for（数据类型 变量:数组名）{}for(var i in array3) {console.log(array3[i]);}</script>
</head>
<body></body>
</html>

八、数学对象

1、创建：Math对象不用创建直接使用。使用时直接调用方法，如：Math.方法名();

2、常用方法：

（1）random()：返回 0 ~ 1 之间的随机数

（2）max(x,y)：返回 x 和 y 中的最大值

（3）min(x,y)：返回 x 和 y 中的最低值

（4）ceil(x)：对数进行向上取整

（5）floor(x)：对数进行向下取整

（6）round(x)：把数四舍五入为最接近的整数

（7）abs(x)：返回数的绝对值

3、属性：PI，圆周率

九、字符串对象

1、创建：
在这里插入图片描述
2、属性：
在这里插入图片描述

3、常用方法：
（1）是否以某个字符开头 startsWith()

（2）是否以某个字符结尾 endsWith()

（3）截取字符串

 a、substring(起始下标,结束角标)

 b、substr(起始下标,截取长度)

（4）根据某个字符拆分字符串 返回数组 split()

（5）返回指定位置的字符 charAt()

（6）检索字符串 indexOf()

十、自定义对象

在这里插入图片描述

相关文章：

JavaScript（1）

JavaScript简介 JavaScript是一门跨平台、面向对象的脚本语言&#xff0c;用来控制网页行为的&#xff0c;它能使网页可以交互。 JavaScript引入方式 1、内部脚本 将js代码定义在HTML页面中&#xff0c;在HTML中&#xff0c;JavaScript代码必须位于<script>与</scrip…...

编程日记 2023/3/3 8:49:59

阿里云云原生每月动态 | 聚焦实战，面向开发者的系列课程全新上线

作者&#xff1a;云原生内容小组 云原生是企业数字创新的最短路径。 《阿里云云原生每月动态》&#xff0c;从趋势热点、产品新功能、服务客户、开源与开发者动态等方面&#xff0c;为企业提供数字化的路径与指南。 本栏目每月更新。 趋势热点 《云原生实战指南》白皮书发布 …...

编程日记 2023/3/3 8:48:55

Goby 征文大擂台，超值盲盒等你来！

001 Goby 技术征文正式启动 Goby 致力于做最好的网络安全工具。为了促进师傅们知识共享和技术交流&#xff0c;现发起关于 Goby 的技术文章征集活动&#xff01; 欢迎所有师傅们参加&#xff0c;分享您的使用经验或挖洞窍门等&#xff0c;帮助其他人更好地了解和利用 Goby。 …...

编程日记 2023/3/3 8:47:50

NLP - langid 语种识别

文章目录一、关于 langid二、基本使用Normalization多个语言中选择一个三、训练模型1、需要2、工具是3、过程4、代码调用自定义模型一、关于 langid https://github.com/saffsd/langid.py 用于检测语言 二、基本使用 import langidlangid.classify("This is a test"…...

编程日记 2023/3/3 8:46:44

liquibase学习和使用

文章目录liquibase学习介绍数据库更新日志和数据库更新日志锁定相关概念changelogchangeset的属性preconditionsql样例Contextssql样例Labelsql样例文件格式sql样例其他格式用的时候在补充跟踪表DATABASECHANGELOGLOCK &#xff08;数据库更改日志锁定表&#xff09;DATABASECH…...

编程日记 2023/3/3 8:45:39

redhawk：Low Power Analysis

1.rush current与switch cell 在standby状态下为了控制leakage power我们选择power gating的设计方式&#xff0c;使用power switch cell关闭block/power domain的电源。 power switch的基本介绍可见: 低功耗设计-Power Switch power switch的table中有四种状态&#xff0c;…...

编程日记 2023/3/3 8:44:31

24- 深度学习的模型保存和加载 (TensorFlow系列) (深度学习)

知识要点 keras 保存成hdf5文件, 1.保存模型和参数, 2.只保存参数 1.保存模型和参数 save_modelcallback ModelCheckpoint2. 只保存参数 save_weightscallback ModelCheckpoint save_weights_only True 保存模型: 案例数据: Fashion-MNIST总共有十个类别的图像model.save_w…...

编程日记 2023/3/3 8:43:22

【Echarts图例点击事件】自定义Echarts图例legend点击事件（已解决）

目录先睹为快&#xff08;效果&#xff09;1、实现Echarts多条曲线2、点击echarts触发接口请求2.1 先默认隐藏部分数据2.2 自定义legend图例点击事件3、源码下载地址&#xff08;解压即用&#xff09;**【写在前面】**这下我又不得不说了&#xff0c;还是客户现场使用时想查询一…...

编程日记 2023/3/3 8:42:14

uniapp-首页配置

为了获取到后台服务器发来的数据&#xff0c;需要配置相应的网络地址。位置在main.js入口文件中。 import { $http } from escook/request-miniprogramuni.$http $http // 配置请求根路径 $http.baseUrl https://api-hmugo-web.itheima.net// 请求开始之前做一些事情 $http.…...

编程日记 2023/3/3 8:41:04

支持DDR5，超频更简单，小雕够给力，技嘉B760M小雕WIFI主板上手

目前13代酷睿已经全员集结了&#xff0c;其中全新的i5 13490F应该依然会备受欢迎&#xff0c;当然了&#xff0c;刚上市不久的13代酷睿价格方面还不是很有吸引力&#xff0c;好在12代酷睿在新一代主板上面依然可用&#xff0c;所以预算有限的朋友&#xff0c;完全可用继续使用1…...

编程日记 2023/3/3 8:39:55

fengMap 自定义dom 偏离实际位置；缩放时飘出地图所在区域

目录 一、问题 二、原因及解决方法 三、总结 一、问题 1.前人写了一份代码&#xff0c;很奇怪。使用 new fengmap.FMCompositeMarker添加的复合覆盖物位置是正常的&#xff0c;缩放的时候也是正常的&#xff0c;仍然处于地图内部&#xff1b;但是new fengmap.FMDomMarker添加…...

编程日记 2023/3/3 8:38:46

TryHackMe-黑我杯

黑我杯 相信我们大家在TryHackMe的日积月累都学到了不少东西&#xff0c;从纯萌新到oscp再到更高 我很高兴能将国内各thm玩家聚集到一起&#xff0c;构建一个更好的学习环境和氛围 本次娱乐分两场&#xff1a; Offensive Pentesting — 中等难度Junior Penetration — 容易难…...

编程日记 2023/3/3 8:37:36

【JAVA程序设计】【C00109】基于SSM（非maven）的员工工资管理系统

基于SSM&#xff08;非maven&#xff09;的员工工资管理系统项目简介项目获取开发环境项目技术运行截图项目简介 基于ssm框架非maven开发的企业工资管理系统共分为二个角色&#xff1a;系统管理员、员工 管理员角色包含以下功能&#xff1a; 系统后台登陆、管理员管理、员工信…...

编程日记 2023/3/3 8:36:29

《计算机原理》——HelloWorld.cpp如何运行的

学校《计算机原理》开课啦&#xff01;特此开辟专栏&#xff0c;将一些知识作为笔记&#xff0c;记录下来。 前言 本篇博客知识点来源于educoder的相关题目 1. 相关知识 1.1 计算机语言 计算机语言是人与计算机之间通讯的语言&#xff0c;计算机语言包括编写计算机程序的字符…...

编程日记 2023/3/3 8:35:20

【面试题】在JS循环中使用await会怎么样？

前言这个问题是这样产生的&#xff1f;某天&#xff0c;在学习异步的知识遇到这样一道题&#xff1a;使用Promise的方式&#xff0c;每隔一秒输出数组中一个值const arr [1, 2, 3] ​ arr.reduce((pre, cur) > {return pre.then(() > {returnnewPromise((resolve, rejec…...

编程日记 2023/3/3 8:34:11

Qt QMessageBox详解

文章目录一.QMessageBox介绍枚举属性函数二.QMessageBox的用法1.导入QMessage库2.弹窗提示3.提供选项的弹窗提示4.作为提示&#xff0c;报警&#xff0c;报错提示窗口一.QMessageBox介绍 文本消息显示框(message box)向用户发出情况警报信息并进一步解释警报或向用户提问&…...

编程日记 2023/3/3 8:33:04

Flutter之beamer路由入门指南

beamer路由入门指南 前言使用方法1、路由配置方式1路由配置方式2路由跳转测试现象前言 Beamer是一个很好用的路由组件，本文以beamer1.5.0版本进行说明，前面博主也介绍了其他路由组件 Flutter实战之go_router路由组件入门指南 、 Flutter之Fluro路由组件入门指南 Flutter之Ge…...

编程日记 2023/3/3 8:31:56

「基础篇」机器学习概览

文章目录1. 什么是机器学习2. 引入机器学习3. 应用场景4. 机器学习分类4.1. 有无人类监督4.2. 是否增量学习4.3. 泛化方式5. 主要挑战6. 测试与验证1. 什么是机器学习 机器学习&#xff08;Machine Learning&#xff0c;ML&#xff09;是一个研究领域&#xff0c;让计算机无需…...

编程日记 2023/3/3 8:30:41

揭秘可视化图探索工具 NebulaGraph Explore 是如何实现图计算的

前言 在可视化图探索工具 NebulaGraph Explorer 3.1.0 版本中加入了图计算工作流功能&#xff0c;针对 NebulaGraph 提供了图计算的能力&#xff0c;同时可以利用工作流的 nGQL 运行能力支持简单的数据读取&#xff0c;过滤及写入等数据处理功能。 本文将简单分享下 NebulaGr…...

编程日记 2023/3/3 8:29:32

移动架构43_什么是Jetpack

Android移动架构汇总​​​​​​​ 文章目录一 Android 开发框架演变1 MVC2 MVP3 MVVM二 什么是JetPack三 如何构建支持Jetpack项目一 Android 开发框架演变 1 MVC Model-View-Controller&#xff0c;模型-视图-控制器&#xff0c;Model负责数据管理&#xff0c;View负责UI显…...

编程日记 2023/3/3 8:28:23

深度解析：汇率结算下的货代对账困局，如何利用 AI 与 RPA 构建底层逻辑？

【前言】在国际物流与货运代理行业&#xff0c;财务对账向来是一块“硬骨头”。尤其是涉及跨国业务时&#xff0c;汇率的实时波动与多币种结算的交叉影响&#xff0c;使得原本复杂的账目核对工作呈几何倍数增加。传统的人工对账模式不仅效率低下&#xff0c;且在面对分位数的四…...

编程新知 2026/3/26 21:54:03

5个维度解析：如何通过Excel可视化突破AI算法学习瓶颈

5个维度解析&#xff1a;如何通过Excel可视化突破AI算法学习瓶颈 【免费下载链接】ai-by-hand-excel 项目地址: https://gitcode.com/gh_mirrors/ai/ai-by-hand-excel 你是否也曾在学习AI算法时遇到这样的困境&#xff1a;面对满屏的数学公式感到无从下手&#xff0c;神…...

编程新知 2026/3/26 20:45:48

3步永久保存喜马拉雅VIP音频：xmly-downloader-qt5全功能测评

3步永久保存喜马拉雅VIP音频&#xff1a;xmly-downloader-qt5全功能测评 【免费下载链接】xmly-downloader-qt5 喜马拉雅FM专辑下载器. 支持VIP与付费专辑. 使用GoQt5编写(Not Qt Binding). 项目地址: https://gitcode.com/gh_mirrors/xm/xmly-downloader-qt5 xmly-down…...

编程新知 2026/3/26 20:25:44

AI辅助开发中的Codec VAD优化实践：从算法原理到工程落地

在实时音视频应用里&#xff0c;语音活动检测&#xff08;VAD&#xff09;就像个“守门员”&#xff0c;负责精准判断当前有没有人在说话。这个判断准不准、快不快&#xff0c;直接关系到后续的编码、传输乃至降噪、唤醒等一系列流程的效率。尤其在AI辅助开发的框架下&#xff…...

编程新知 2026/3/26 20:03:37

ai辅助c语言开发：让快马智能生成复杂格式文件读写代码

最近在开发一个C语言程序时需要处理自定义数据包格式&#xff0c;正好体验了用AI辅助开发的便捷。这个数据包格式包含包头标识、包体长度和JSON格式的包体数据&#xff0c;需要实现读写功能。下面分享我的实现过程和AI辅助开发的实用技巧。 数据包结构分析 首先明确数据包由三部…...

编程新知 2026/3/26 19:31:19

塔罗牌选框架：准确率超机器学习模型

技术选型困境与创新突破在软件测试领域&#xff0c;技术栈选择一直是核心挑战。传统方法依赖历史数据和机器学习模型&#xff0c;但常陷入“预测陷阱”——过度依赖过往经验导致创新盲区。例如&#xff0c;自动化测试框架的错误选型每年造成巨额损失&#xff1a;38.7%源于技术生…...

编程新知 2026/3/26 18:54:40

隔离变送器VS普通变送器：为什么你的PLC信号总受干扰？（实测XYS-5531抗干扰性能）

隔离变送器VS普通变送器&#xff1a;为什么你的PLC信号总受干扰&#xff1f;&#xff08;实测XYS-5531抗干扰性能&#xff09; 在工业自动化现场&#xff0c;信号干扰就像潜伏的"隐形杀手"——它不会直接摧毁设备&#xff0c;却能让控制系统频繁误动作、数据采集失真…...

编程新知 2026/3/26 18:03:55

嵌入式软件架构设计与实践指南

## 1. 嵌入式软件架构设计概述### 1.1 嵌入式系统发展现状 现代嵌入式系统硬件性能已实现质的飞跃&#xff0c;以Marvell PXA3xx系列处理器为例&#xff0c;其主频可达800MHz&#xff0c;集成USB、WIFI、2D图形加速和32位DDR内存控制器。软件层面&#xff0c;Symbian、Linux、W…...

编程新知 2026/3/26 15:52:44

LeetCode 1423. 可获得的最大点数【定长滑窗,逆向和正向思维】1574

本文属于「征服LeetCode」系列文章之一&#xff0c;这一系列正式开始于2021/08/12。由于LeetCode上部分题目有锁&#xff0c;本系列将至少持续到刷完所有无锁题之日为止&#xff1b;由于LeetCode还在不断地创建新题&#xff0c;本系列的终止日期可能是永远。在这一系列刷题文章…...

编程新知 2026/3/26 15:13:58

共享文件是谁删除的？谁删了那个文件？一次“误删事件”背后的思考

上周&#xff0c;公司设计部的一位主管在准备客户提案时&#xff0c;突然发现关键素材文件夹不见了。那里面是整个团队近两周的工作成果——图片、方案、视频文件应有尽有。大家在共享目录里翻来覆去找了半天&#xff0c;最后只得到一个模糊的解释&#xff1a;“可能是谁误删了…...

编程新知 2026/3/26 15:01:56