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

es6新语法和ajax和json

news 2025/7/6 13:22:54

es6新语法

1.定义变量：let

2.定义常量：const

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><script>let i=3;const j="aaa";//不可更改</script>
</body>
</html>

3.模板字符串

模板字符串，要使用``重音符，使用${标识符}

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><script>//es5,字符串拼接需要使用+let username="hhh";console.log("用户名是："+username);//es6,使用模板字符串console.log(`用户名是：${username}`);//${标识符}只能使用在重音符内//${标识符}不可以使用在单引号，双引号中</script>
</body>
</html>

4.参数默认值

在js中如果定义的函数有参数，调用的时候可以不传递实参，那么形参变量名就是undefined类型，值也是undefined，所以调用函数的时候不传递参数，就会使用函数默认值，如果传递实参就使用实参 

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><script>function name(name="jack"){console.log(name);}name();//jack,不传递实参，就使用默认值name("lose")//lose</script>
</body>
</html>

5.箭头函数

格式：

let 函数名 =(参数1,参数2...)=>{函数体};

如果函数体就一句话，可以省略{}和return 

使用

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><script>//es5let add1=function(a,b){console.log(a+b);}add1(1,2);//3//es6let add2=(a,b)=>{console.log(a+b)};add2(1,2);//3//函数体只有一句话，可以省略{}let add3=(a,b)=>console.log(a+b);add3(1,2);//3let add4=(a,b)=>a+b;let result=add4(3,4);console.log(result);//7</script>
</body>
</html>

同步和异步

说明：向后台发送数据时，同步的方式是后台必须返回响应数据才可以在浏览器进行下一次操作，而异步方式可以在不需要等待后台服务器响应数据，直接可以进行其他操作。

ajax

可以完成前端和后台服务器的数据交互

好处

        1.网页局部更新

        2.异步请求

ajax的异步操作axios

使用前先导入

 <script src="https://cdn.jsdelivr.net/npm/axios@1.6.7/dist/axios.min.js"></script>

发送get请求

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><script src="https://cdn.jsdelivr.net/npm/axios@1.6.7/dist/axios.min.js"></script>
<!-- 导入axios --><script>/*1.http://localhost:8080/axiosDemo01Servlet 表示后台服务器地址2.username=hhh&password=123:表示向后台携带的参数，和地址之间使用?分隔*///向后台发送ajax的get异步请求axios.get("http://localhost:8080/axiosDemo01Servlet?username=hhh&password=123").then(response=>{//后台响应成功，在这里处理后台响应数据的console.log(response);//response.data 接收服务端响应的数据console.log(response.data);}).catch(error=>{//后台出现异常在前端这里处理console.log(error);console.log("后台出现异常")}).finally(()=>{console.log("我是必须执行的");});</script>
</body>
</html>

 发送post请求

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><script src="https://cdn.jsdelivr.net/npm/axios@1.6.7/dist/axios.min.js"></script><script>//使用axios发送post请求axios.post("http://localhost:8080/axiosDemo01Servlet","username=hh&password=123").then(res=>{console.log("后台响应的数据是"+res.data);}).catch(err=>{//处理错误信息console.log(err);console.log("后台出现错误");}).finally(()=>{console.log("我是必须执行的")})</script>
</body>
</html>

json

1.json在js中是一个对象，在java中是字符串

2.作用：用来在前后台数据传输

3.格式

{key:value,key:value...}; 

 4.json语法

1. {} 表示对象

{name:value,name:value...}

2. [] 表示数组

[

{name:value,name:value...}

{name:value,name:value...}

]

注意：

1.其中name必须是string类型

        在json中，string类型的双引号可以省略，但是建议加上

2.value必须是以下数据类型

        字符串

        数字

        对象(json对象)

        数组

        布尔

        Null

3.json的字符串必须使用双引号包围（单引号不行）

相关文章：

es6新语法和ajax和json

es6新语法 1.定义变量&#xff1a;let 2.定义常量&#xff1a;const <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"…...

编程日记 2024/5/16 2:09:34

Hadoop3：HDFS副本节点选择逻辑讲解

一、副本节点选择&#xff08;机架感知&#xff09; 说明 第一个副本&#xff0c;因为我们的client可能是web页&#xff0c;也可能是shell终端。 如果是web页&#xff0c;则随机选取一个节点&#xff0c;如果是shell终端&#xff0c;则选择当前shell终端所在的节点。 节点距离最…...

编程日记 2024/5/16 2:07:32

Java 高级面试问题及答案 更新（二）

Java 高级面试问题及答案 以下是几个常见的Java高级面试问题及其答案&#xff0c;这些问题覆盖了Java语言的核心概念和高级特性。 问题1: 什么是Java内存模型(JMM)&#xff0c;它在并发编程中扮演着什么角色&#xff1f; 答案&#xff1a; Java内存模型(JMM)是一个抽象的概念…...

编程日记 2024/5/16 2:05:29

MacOS安装Go

下载 Go 安装包&#xff1a; 访问 Go 官方网站的下载页面&#xff0c;找到适合 macOS 系统的 Go 安装包&#xff0c;并下载 go1.20.2.darwin-amd64.pkg&#xff08;假设你的 macOS 是 64 位系统&#xff09;。 安装 Go&#xff1a; 打开下载的安装包 go1.20.2.darwin-amd64.pk…...

编程日记 2024/5/16 2:04:27

【微服务最全详解】

文章目录 微服务微服务的介绍微服务服务架构演变 微服务网关微服务的负载均衡微服务的容灾机制服务崩溃服务容灾机制微服务熔断机制微服务限流Sentinel怎么实现限流微服务限流算法1.令牌桶算法2.漏斗桶算法 服务监控日志收集 微服务 微服务的介绍 微服务是一种软件架构风格&a…...

编程日记 2024/5/16 2:03:26

如何在云电脑实现虚拟应用—数据分层（应用分层）技术简介

数据分层&#xff08;应用分层&#xff09;技术简介 近几年虚拟化市场实现了非常大的发展&#xff0c;桌面虚拟化在企业中应用越来越广泛&#xff0c;其拥有的如下优点得到大量企业的青睐&#xff1a; 数据安全不落地。在虚拟化环境下面数据保存在中心服务器上面&#xff0c;…...

编程日记 2024/5/16 2:02:24

【动态规划五】回文串问题

目录 leetcode题目 一、回文子串 二、最长回文子串 三、分割回文串 IV 四、分割回文串 II 五、最长回文子序列 六、让字符串成为回文串的最少插入次数 leetcode题目 一、回文子串 647. 回文子串 - 力扣&#xff08;LeetCode&#xff09;https://leetcode.cn/problems/…...

编程日记 2024/5/16 2:01:23

【C++杂货铺铺】AVL树

目录 &#x1f308;前言&#x1f308; &#x1f4c1; 概念 &#x1f4c1; 节点的定义 &#x1f4c1; 插入 &#x1f4c1; 旋转 1 . 新节点插入较高左子树的左侧---左左&#xff1a;右单旋 2. 新节点插入较高右子树的右侧---右右&#xff1a;左单旋 3. 新节点插入较高左…...

编程日记 2024/5/16 2:00:22

【R语言】生存分析模型

生存分析模型是用于研究时间至某个事件发生的概率的统计模型。这个事件可以是死亡、疾病复发、治疗失败等。生存分析模型旨在解决在研究时间相关数据时的挑战&#xff0c;例如右侧截尾&#xff08;右侧截尾表示未观察到的事件发生&#xff0c;例如研究结束时还未发生事件&#…...

编程日记 2024/5/16 1:59:20

「AIGC」Python实现tokens算法

本文主要介绍通过python实现tokens统计，避免重复调用openai等官方api，开源节流。 一、设计思路 初始化tokenizer使用tokenizer将文本转换为tokens计算token的数量二、业务场景 2.1 首次加载依赖 2.2 执行业务逻辑 三、核心代码 from transformers import AutoTokenizer imp…...

编程日记 2024/5/16 1:58:19

【Unity】编程感悟20240510

【背景】 这一点感悟是过去有所认识&#xff0c;但是最近写Unity项目&#xff0c;涉及UDP通信需要持续监听逻辑时更加感受深刻的。 选用合适的触发点&#xff0c;用明确的逻辑避免循环处理 尽量采用明确的触发点使逻辑清晰&#xff0c;规避一定时间刷新这类的逻辑。 比如UDP…...

编程日记 2024/5/16 1:57:17

C#【进阶】泛型

1、泛型 文章目录 1、泛型1、泛型是什么2、泛型分类3、泛型类和接口4、泛型方法5、泛型的作用思考 泛型方法判断类型 2、泛型约束1、什么是泛型2、各泛型约束3、约束的组合使用4、多个泛型有约束思考1 泛型实现单例模式思考2 ArrayList泛型实现增删查改 1、泛型是什么 泛型实现…...

编程日记 2024/5/16 1:56:16

50. UE5 RPG FGameplayEffectContext

接下来&#xff0c;我想实现处理完伤害时&#xff0c;将伤害的触发格挡或者触发暴击时的逻辑传递到数据集的PostGameplayEffectExecute里面&#xff0c;这样&#xff0c;在处理IncomingDamage时&#xff0c;我们可以通过释放触发格挡或者触发暴击在UI上面进行对应的效果表现。 …...

编程日记 2024/5/16 1:55:15

Golang 的 unmarshal 踩坑指南

文章目录 1. 写在最前面2. 字段区分出空字段还是未设置字段2.1 问题描述2.2 解决 3. 字段支持多种类型 & 按需做不同类型处理3.1 问题描述3.2 解决 4. 碎碎念5. 参考资料 1. 写在最前面 笔者最近在实现将内部通知系统的数据定义转化为产品定义的对外提供的数据结构。 举例…...

编程日记 2024/5/16 1:53:13

Linux的常用指令 和 基础知识穿插巩固（巩固知识必看）

目录 前言 ls ls 扩展知识 ls -l ls -a ls -al cd cd 目录名 cd .. cd ~ cd - pwd 扩展知识 路径 / cp [选项] “源文件名” “目标文件名” mv [选项] “源文件名” “目标文件名” rm 作用 用法 ./"可执行程序名" mkdir rmdir touch m…...

编程日记 2024/5/16 1:52:11

MP3解码入门（基于libhelix）

主要参考资料: 【Arduino Linux】基于 Helix 解码库实现 MP3 音频播放: https://blog.csdn.net/weixin_42258222/article/details/122640413 libhelix-mp3: https://github.com/ultraembedded/libhelix-mp3/tree/master 目录 一、MP3文件二、MP3 解码库三、libhelix-mp3库3.1 …...

编程日记 2024/5/16 1:48:06

Oracle 中索引与完整性（SQL）

索引 在数据库中建立索引主要有以下作用&#xff1a; &#xff08;1&#xff09;快速存取数据&#xff1b; &#xff08;2&#xff09;既可以改善数据库性能&#xff0c;又可以保证列值的唯一性&#xff1b; &#xff08;3&#xff09;实现表与表之间的参照完整性&#xff1b;…...

编程日记 2024/5/16 1:47:04

【Linux深度学习笔记5.13(Apache)】

Apache : 1.安装yum -y install hhtpd2.启动hhtpd -k start3.停止httpd -k stop4.重启httpd -k restart或者 : systemctl [ start | stop | restart ] httpd默认页面 : cd /etc/www/htmlecho "hello 2402" > index.html验证 : 浏览器访问 : http://ip 访问控制…...

编程日记 2024/5/16 1:44:01

汇编语言入门：探索 x86 架构

目录 前言 1. x86 语言 x86 架构简介 x86 架构的特点 x86 架构的演变 x86 架构的应用 2. 常用汇编指令集 3. 寻址方式 结语 前言 汇编语言是一种低级编程语言&#xff0c;直接面向计算机的硬件架构。在计算机科学中&#xff0c;了解汇编语言是非常重要的&#xff0c;因…...

编程日记 2024/5/16 1:41:59

[ffmpeg处理指令]

1 将h264转为mp4 ffmpeg -f h264 -i front_far_0.264 -vcodec copy front_far_0.mp4 ffmpeg -f h264 -i front_near_0.264 -vcodec copy front_near_0.mp4 -i&#xff1a;表示输入文件 front_far_2.mp4&#xff1a;表示输出文件 2 h264转为图片 front_far 是目标路径,需要…...

编程日记 2024/5/16 1:37:54

rknn优化教程（二）

文章目录 1. 前述2. 三方库的封装2.1 xrepo中的库2.2 xrepo之外的库2.2.1 opencv2.2.2 rknnrt2.2.3 spdlog 3. rknn_engine库 1. 前述 OK&#xff0c;开始写第二篇的内容了。这篇博客主要能写一下&#xff1a; 如何给一些三方库按照xmake方式进行封装&#xff0c;供调用如何按…...

编程新知 2025/6/11 15:25:30

基于Uniapp开发HarmonyOS 5.0旅游应用技术实践

一、技术选型背景 1.跨平台优势 Uniapp采用Vue.js框架&#xff0c;支持"一次开发&#xff0c;多端部署"&#xff0c;可同步生成HarmonyOS、iOS、Android等多平台应用。 2.鸿蒙特性融合 HarmonyOS 5.0的分布式能力与原子化服务&#xff0c;为旅游应用带来&#xf…...

编程新知 2025/6/21 9:41:59

TRS收益互换：跨境资本流动的金融创新工具与系统化解决方案

一、TRS收益互换的本质与业务逻辑 &#xff08;一&#xff09;概念解析 TRS&#xff08;Total Return Swap&#xff09;收益互换是一种金融衍生工具&#xff0c;指交易双方约定在未来一定期限内&#xff0c;基于特定资产或指数的表现进行现金流交换的协议。其核心特征包括&am…...

编程新知 2025/7/3 9:50:42

鸿蒙中用HarmonyOS SDK应用服务 HarmonyOS5开发一个生活电费的缴纳和查询小程序

一、项目初始化与配置 1. 创建项目 ohpm init harmony/utility-payment-app 2. 配置权限 // module.json5 {"requestPermissions": [{"name": "ohos.permission.INTERNET"},{"name": "ohos.permission.GET_NETWORK_INFO"…...

编程新知 2025/7/5 1:17:25

Xen Server服务器释放磁盘空间

disk.sh #!/bin/bashcd /run/sr-mount/e54f0646-ae11-0457-b64f-eba4673b824c # 全部虚拟机物理磁盘文件存储 a$(ls -l | awk {print $NF} | cut -d. -f1) # 使用中的虚拟机物理磁盘文件 b$(xe vm-disk-list --multiple | grep uuid | awk {print $NF})printf "%s\n"…...

编程新知 2025/6/21 10:27:51

华为OD机考-机房布局

import java.util.*;public class DemoTest5 {public static void main(String[] args) {Scanner in new Scanner(System.in);// 注意 hasNext 和 hasNextLine 的区别while (in.hasNextLine()) { // 注意 while 处理多个 caseSystem.out.println(solve(in.nextLine()));}}priv…...

编程新知 2025/7/2 15:38:04

【Linux】Linux 系统默认的目录及作用说明

博主介绍&#xff1a;✌全网粉丝23W&#xff0c;CSDN博客专家、Java领域优质创作者&#xff0c;掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域✌ 技术范围&#xff1a;SpringBoot、SpringCloud、Vue、SSM、HTML、Nodejs、Python、MySQL、PostgreSQL、大数据、物…...

编程新知 2025/7/4 18:12:21

CRMEB 中 PHP 短信扩展开发：涵盖一号通、阿里云、腾讯云、创蓝

目前已有一号通短信、阿里云短信、腾讯云短信扩展 扩展入口文件 文件目录 crmeb\services\sms\Sms.php 默认驱动类型为&#xff1a;一号通 namespace crmeb\services\sms;use crmeb\basic\BaseManager; use crmeb\services\AccessTokenServeService; use crmeb\services\sms\…...

编程新知 2025/6/15 16:44:42

Ubuntu Cursor升级成v1.0

0. 当前版本低 使用当前 Cursor v0.50时 GitHub Copilot Chat 打不开&#xff0c;快捷键也不好用&#xff0c;当看到 Cursor 升级后&#xff0c;还是蛮高兴的 1. 下载 Cursor 下载地址&#xff1a;https://www.cursor.com/cn/downloads 点击下载 Linux (x64) &#xff0c;…...

编程新知 2025/7/5 22:06:04

Python网页自动化Selenium中文文档

1. 安装 1.1. 安装 Selenium Python bindings 提供了一个简单的API&#xff0c;让你使用Selenium WebDriver来编写功能/校验测试。 通过Selenium Python的API&#xff0c;你可以非常直观的使用Selenium WebDriver的所有功能。 Selenium Python bindings 使用非常简洁方便的A…...

编程新知 2025/6/17 15:40:23