JS-16-标签函数

一、模版字符串

模版字符串,可以非常方便地引用变量,并合并出最终的字符串。

它允许你嵌入表达式,并通过${expression}语法来执行这些表达式。模板字符串使用反引号(`)而不是普通的单引号或双引号。

 

模板字符串有几个主要的优点:

1、多行字符串:你可以直接在字符串中换行,而不需要使用\n或字符串连接。

let greeting = `  
  Hello,  
  this is a template string  
  that spans multiple lines.  
`;  
console.log(greeting);


2、嵌入表达式:使用${}可以嵌入变量或执行JavaScript表达式。

let name = "Alice";  
let age = 30;  
  
let bio = `My name is ${name} and I am ${age} years old.`;  
console.log(bio);  // 输出: My name is Alice and I am 30 years old.


3、标签模板:模板字符串可以与函数一起使用,以创建更复杂的字符串操作。

标签模板允许你定义一个函数来处理模板字符串。函数的第一个参数是一个字符串数组,其余的参数是模板字符串中的变量。

function upperCase(strings, ...values) {  
  let result = '';  
  for (let i = 0; i < strings.length; i++) {  
    result += strings[i];  
    if (i < values.length) {  
      result += values[i].toUpperCase();  
    }  
  }  
  return result;  
}  
  
let greeting = upperCase`hello, ${'world'}!`;  
console.log(greeting);  // 输出: hello, WORLD!

二、标签函数

什么是标签函数?让我们看一个例子:

const email = "test@example.com";
const password = 'hello123';

function sql(strings, ...exps) {
    console.log(`SQL: ${strings.join('?')}`);
    console.log(`SQL parameters: ${JSON.stringify(exps)}`);
    return {
        name: '小明',
        age: 20
    };
}

const result = sql`SELECT * FROM users WHERE email=${email} AND password=${password}`;

console.log(JSON.stringify(result));

 

这里出现了一个奇怪的语法:

sql`SELECT * FROM users WHERE email=${email} AND password=${password}`

模板字符串前面以sql开头,实际上这是一个标签函数,上述语法会自动转换为对sql()函数的调用。我们关注的是,传入sql()函数的参数是什么?

sql()函数实际上接收两个参数:

第一个参数strings是一个字符串数组,它是["SELECT * FROM users WHERE email=", " AND password=", ""],即除去${xxx}剩下的字符组成的数组;

第二个参数...exps是一个可变参数,它接收的也是一个数组,但数组的内容是由模板字符串里所有的${xxx}的实际值组成,即["test@example.com", "hello123"],因为解析${email}得到"test@example.com",解析${password}得到"hello123"。

标签函数sql()实际上是一个普通函数,我们在内部把strings拼接成一个SQL字符串,把...exps作为参数,就可以实现一个安全的SQL查询,并返回查询结果。此处并没有真正的数据库连接,因此返回一个固定的Object。

标签函数和普通函数的定义区别仅仅在于参数,如果我们想对数据库进行修改,完全可以定义一个标签函数如下:

function update(strings, ...exps) {
    let sql = strings.join('?');
    // 执行数据库更新
    // TODO:
}

函数调用可以简化为带标签的模板字符串:

let id = 123;
let age = 21;
let score = 'A';

update`UPDATE users SET age=${age}, score=${score} WHERE id=${id}`;

 

三、备注

3-1、strings.join()

在 JavaScript 中,Array.prototype.join() 是一个数组方法,用于将数组(或数组的一个子集)的所有元素连接到一个字符串中

join() 方法接受一个可选的参数,这个参数将作为连接数组中各个元素的分隔符。如果省略该参数,数组元素会以逗号 (,) 分隔

示例:

let fruits = ["Banana", "Orange", "Apple", "Mango"];  
  
let fruitString = fruits.join();      // "Banana,Orange,Apple,Mango"  
let fruitStringWithSpace = fruits.join(" "); // "Banana Orange Apple Mango"  
let fruitStringWithDash = fruits.join("-"); // "Banana-Orange-Apple-Mango"

3-2、JSON.stringify()

在 JavaScript 中,JSON.stringify() 方法用于将一个 JavaScript 值(对象或数组)转换为一个 JSON 格式的字符串

这个方法非常有用,特别是在需要将 JavaScript 数据结构发送到服务器或者保存到本地存储时。

JSON.stringify() 方法可以接受几个参数来定制输出的 JSON 字符串:

1、value (必需):要转换的 JavaScript 值(对象或数组)。
2、replacer (可选):一个函数数组,用于在字符串化过程中过滤替换值。
3、space (可选):一个字符串或数字,用于在输出 JSON 中添加缩进换行,使其更易于阅读。

这里是一些使用 JSON.stringify() 的示例:

let obj = {  
  name: "John",  
  age: 30,  
  city: "New York"  
};  
  
let jsonString = JSON.stringify(obj);  
console.log(jsonString); // 输出: {"name":"John","age":30,"city":"New York"}  
  
// 使用 replacer 函数来过滤属性  
function replacer(key, value) {  
  if (typeof value === 'string') {  
    return undefined; // 返回 undefined 将从输出中删除该属性  
  }  
  return value;  
}  
  
let filteredJsonString = JSON.stringify(obj, replacer);  
console.log(filteredJsonString); // 输出: {"age":30}  
  
// 使用 space 参数来格式化输出  
let formattedJsonString = JSON.stringify(obj, null, 2);  
console.log(formattedJsonString);  
/* 输出:  
{  
  "name": "John",  
  "age": 30,  
  "city": "New York"  
}  
*/

在Java中,将对象、数组转换为JSON格式通常需要使用第三方库!

 

3-3、java:数组——>字符串 

1、使用Arrays.toString()方法

它特别适用于打印数组内容到控制台,因为它会为数组的每个元素添加方括号和逗号。

import java.util.Arrays;  
  
public class Main {  
    public static void main(String[] args) {  
        int[] array = {1, 2, 3, 4, 5};  
        String str = Arrays.toString(array);  
        System.out.println(str);  // 输出: [1, 2, 3, 4, 5]  
    }  
}

2、使用String.join()方法

想要一个没有方括号和逗号的字符串,并且元素之间由特定的分隔符分隔,那么可以使用String.join()方法。

import java.util.Arrays;

public class ArrayToString {

    public static void main(String[] args) {
        // 示例:整数数组
        int[] intArray = {1, 2, 3, 4, 5};
        // 使用 String.valueOf 将每个整数转换为字符串,然后使用逗号作为分隔符
        String intString = String.join(", ", Arrays.stream(intArray).mapToObj(String::valueOf).toArray(String[]::new));
        System.out.println(intString); // 输出: 1, 2, 3, 4, 5

        // 示例:字符串数组
        String[] stringArray = {"apple", "banana", "cherry"};
        // 直接使用逗号作为分隔符
        String stringString = String.join(", ", stringArray);
        System.out.println(stringString); // 输出: apple, banana, cherry
    }

}

String.join() 期望接收一个字符串数组作为参数,我们需要首先将整数数组转换为字符串数组。这可以通过使用Java 8的流(Streams)和 mapToObj 方法来实现,将每个整数映射到其字符串表示形式。然后,我们使用 toArray() 方法将流转换回数组,并将其传递给 String.join()。 

3、for循环传统方式

public class Main {  
    public static void main(String[] args) {  
        int[] array = {1, 2, 3, 4, 5};  
        // 拼接字符串
        StringBuilder sb = new StringBuilder();  
        for (int i = 0; i < array.length; i++) {  
            sb.append(array[i]);  
            if (i < array.length - 1) {  
                sb.append(", ");  
            }  
        }  
        String str = sb.toString();  
        System.out.println(str);  // 输出: 1, 2, 3, 4, 5  
    }  
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/494347.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

【git】git使用手册

目录 一 初始化 1.1 账号配置 1.2 ssh生成 1.2.1 配置ssh 1.2.2 测试SSH 1.3 初始化本地仓库并关联远程仓库 二 使用 2.1 上传 2.2 拉取 三 问题 3.1 关联失败 一 初始化 git的安装很简单,下载后大部分进行下一步完成即可----->地址: git工具下载 1.1 账号配置…

HCIP —— 链路聚合

链路聚合 背景 随着网络规模不断扩大&#xff0c;用户对骨干链路的带宽和可常性提出越来越高的要求&#xff0c;在传统技术中&#xff0c;常用更换高速率的设备的方式来增加带宽&#xff0c;但这种方案需要付出高额的费用&#xff0c;而且不够灵活。 而采用链路聚合技术可以在…

记录关于智能家居的路程的一个bug___Segmentation fault(段错误)

前言 其实发生段错误的情况有很多&#xff1a; 其实在项目的开发中最有可能的错误就是①和②&#xff0c;考虑到本项目数组用的比较少&#xff0c;所以主要是考虑错误①指针的误用。 有时候错误就是那么离谱&#xff0c;声音也算是一种设备&#xff1f;&#xff1f;&#xff…

Dockerfile:自定义镜像

Dockerfile 是一个文本文件&#xff0c;其中包含了一系列用于自动化构建Docker镜像的指令。通过编写Dockerfile&#xff0c;开发者能够明确地定义一个软件应用及其运行环境应该如何被封装进一个可移植、可重复构建的Docker镜像中。 第一步&#xff1a;在/tmp文件下新建docker…

GEE:将分类特征和标签提取到样本点,并以(csv/shp格式)下载到本地

作者:CSDN @ _养乐多_ 本文将介绍在Google Earth Engine(GEE)平台上,下载用于机器学习分类或者回归的样本点数据,样本点数据携带了分类特征和标签信息,可以以csv格式或者SHP格式。 结果如下图所示, 文章目录 一、核心函数1.1 采样1.2 下载函数二、代码链接三、完整代码…

Machine Learning机器学习之K近邻算法(K-Nearest Neighbors,KNN)

目录 前言 背景介绍&#xff1a; 思想&#xff1a; 原理&#xff1a; KNN算法关键问题 一、构建KNN算法 总结&#xff1a; 博主介绍&#xff1a;✌专注于前后端、机器学习、人工智能应用领域开发的优质创作者、秉着互联网精神开源贡献精神&#xff0c;答疑解惑、坚持优质作品共…

Python入门练习 - 学生管理系统

Python 实现读书管理系统 """ 实现一个命令行版的读书管理系统 """ import os.path import sys# 使用这个全局变量&#xff0c;来管理所有的学生信息 # 这个列表的每个元素都是一个‘字典’&#xff0c;每 个 字典就分别表示了一个同学students …

电脑访问网页获取路由器WAN口内网IP

因为运维过程中容易出现路由器配置了固定IP但是没人知道后台密码&#xff0c;不确定这个办公室的IP地址&#xff0c;且使用tracert路由追踪也只会出现路由器的LAN口网关并不会出现WAN口IP。 今日正好遇到了个好方法&#xff0c;经过测试可以正常使用。 方法如下&#xff1a; 内…

机器视觉矿山安全生产风险预警系统

一、简介 十四五规划和2035年远景目标纲要针对企业安全生产提出了多项要求。其中&#xff0c;提高安全生产水平要求完善和贯彻执行安全生产责任制&#xff0c;建立公共安全隐患排查和安全预防控制体系&#xff0c;要求将安全生产提升至预防和控制阶段。 目前&#xff0c;矿山…

0DAY漏洞是什么,如何进行有效的防护

零日漏洞&#xff0c;指的是软件或系统中未被公开的、未被厂商知晓的安全漏洞。这些漏洞未被修复&#xff0c;因此黑客可以利用它们进行攻击&#xff0c;而受害者往往无法防范。由于这些漏洞的存在时间很短&#xff0c;因此称之为“零日漏洞”&#xff0c;也称为“0day漏洞”。…

LeetCode:1319. 连通网络的操作次数(并查集 Java)

目录 1319. 连通网络的操作次数 题目描述&#xff1a; 实现代码与解析&#xff1a; 并查集 原理思路&#xff1a; 1319. 连通网络的操作次数 题目描述&#xff1a; 用以太网线缆将 n 台计算机连接成一个网络&#xff0c;计算机的编号从 0 到 n-1。线缆用 connections 表示…

【Bug-ModuleNotFoundError: No module named ‘models‘】

&#x1f680; 作者 &#xff1a;“码上有前” &#x1f680; 文章简介 &#xff1a;Python &#x1f680; 欢迎小伙伴们 点赞&#x1f44d;、收藏⭐、留言&#x1f4ac; 出现这个错误&#xff1a; 出现了ModuleNotFoundError: No module named models’的问题。 文件在Model…

春秋云境CVE-2023-27179

简介 GDidees CMS v3.9.1及更低版本被发现存在本地文件泄露漏洞&#xff0c;漏洞通过位于 /_admin/imgdownload.php 的 filename 参数进行利用。 正文 进入靶场发现没有什么可以利用的地方&#xff0c;那么就按照靶场提示来&#xff0c;直接访问/_admin/imgdownload.php 打开…

SQLite数据库浏览器sqlite-web

什么是 sqlite-web &#xff1f; sqlite-web是一个用 Python 编写的基于 Web 的 SQLite 数据库浏览器。 软件特点&#xff1a; 可与您现有的 SQLite 数据库配合使用&#xff0c;也可用于创建新数据库。添加或删除&#xff1a; 表格列&#xff08;支持旧版本的 SQLite&#xff…

网络链路层之(1)基础概念

网络链路层之(1)基础概念 Author: Once Day Date: 2024年3月27日 一位热衷于Linux学习和开发的菜鸟&#xff0c;试图谱写一场冒险之旅&#xff0c;也许终点只是一场白日梦… 漫漫长路&#xff0c;有人对你微笑过嘛… 全系列文章可参考专栏: 通信网络技术_Once-Day的博客-CSD…

Spring(详细介绍)

目录 一、简介 1、什么是Spring&#xff1f; 2、Spring框架的核心特性 3、优点 二、IOC容器 介绍 1、获取资源的传统方式 2、控制反转方式获取资源 3、DI 4、IOC容器在Spring中的实现 入门案例 1、创建Maven Module 2、引入依赖 3、创建HelloWorld类 4、在Spring的配…

EdgeGallery开发指南

API接口 简介 EdgeGallery支持第三方业务系统通过北向接口网关调用EdgeGallery的业务接口。调用流程如下图所示&#xff08;融合前端edgegallery-fe包含融合前端界面以及北向接口网关功能&#xff0c;通过浏览器访问时打开的是融合前端的界面&#xff0c;通过IP:Port/urlPref…

Overcooked!(并查集区间元素合并优化)

本题链接&#xff1a;登录—专业IT笔试面试备考平台_牛客网登录—专业IT笔试面试备考平台_牛客网登录—专业IT笔试面试备考平台_牛客网 题目&#xff1a; 样例&#xff1a; 输入 5 5 1 1 2 3 1 2 2 2 4 3 1 4 3 2 5 输出 YES YES NO 思路&#xff1a; 根据题意&#xff0c;这…

KubeSphere简单介绍及安装使用

KubeSphere 概述 官网地址&#xff1a;https://kubesphere.io/zh/ 什么是 kubesphere KubeSphere 是一个开源的多云容器管理平台&#xff0c;旨在简化企业级 k8s 集群的部署、管理和运维。它提供了一个可视化的管理界面&#xff0c;帮助用户更轻松地管理和监控 k8s 集群&…

『Apisix进阶篇』动态负载均衡:APISIX的实战演练与策略应用

&#x1f680;『Apisix系列文章』探索新一代微服务体系下的API管理新范式与最佳实践 【点击此跳转】 &#x1f4e3;读完这篇文章里你能收获到 &#x1f3af; 掌握APISIX中多种负载均衡策略的原理及其适用场景。&#x1f4c8; 学习如何通过APISIX的Admin API和Dashboard进行负…