JS-16-标签函数

news2024/11/16 21:37:50

一、模版字符串

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

它允许你嵌入表达式,并通过${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  
    }  
}

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

工作的第二天

昨天的进度 写今天思路如何做评论表的增删该查评论表的增加 选择用户和商品 弹出框出现了问题 检查代码 结构没有问题 定义变量也没有问题 控制太中也没有报错信息 问题解决了 出现的问题在哪里定义的变量都有问题应该现在 setup 上面 定义一个 变量 const ref ref(fals…

Python爬虫如何快速入门

写了几篇网络爬虫的博文后&#xff0c;有网友留言问Python爬虫如何入门&#xff1f;今天就来了解一下什么是爬虫&#xff0c;如何快速的上手Python爬虫。 一、什么是网络爬虫 网络爬虫&#xff0c;英文名称为Web Crawler或Spider&#xff0c;是一种通过程序在互联网上自动获取…

Excel学习笔记(持续更新-20240326)

写在前面 Excel的学习心得分享&#xff0c;佛系更新。2024/03/26 目录 Excel每次都是以只读模式打开 给Excel设置“开机密码” 保护你的excel不让别人篡改 1.1Excel每次都是以只读模式打开 背景&#xff1a;如果有个工具&#xff0c;每天都有很多人使用&#xff0c;如果是…

【SpringBoot】读取配置文件

读取appliaction.properties里面的端口数据 Value方式 RestController public class getText {//value方式读取文件Value("${server.port}")private String port;GetMapping("getPort")public String getPort(){return port;} }使用ConfigurationPropert…

第4章:掌握标准提示,输出更精准

标准提示 标准提示&#xff0c;是引导ChatGPT输出的一个简单方法&#xff0c;它提供了一个具体的任务让模型完成。 如果你要生成一篇新闻摘要。你只要发送指示词&#xff1a;“汇总这篇新闻”。 提示公式&#xff1a;生成[任务] 生成新闻文章的摘要&#xff1a; 任务&#x…

【每日跟读】常用英语500句(100~200)

【每日跟读】常用英语500句 My apologies. 我向你道歉 Mayday. 求救 I’m begging you. 我求你了 Allow me. 让我来 That’s for sure. 那是肯定的 I wish I could. 我希望我能 Don’t leave me. 别离开我 You suck. 你太烂了 In that case. 这样的话 From now on. 从…

AI大模型学习——AI领域技术发展

目录 前言 一、AI大模型学习的理论基础 二、AI大模型的训练与优化 三、AI大模型在特定领域的应用 四、AI大模型学习的伦理与社会影响 五、未来发展趋势与挑战 总结 前言 在当前技术环境下&#xff0c;AI大模型学习不仅要求研究者具备深厚的数学基础和编程能力&#xff…

安达发|印染行业选择APS自动排单软件需要注意什么?

在印染行业中&#xff0c;APS&#xff08;高级计划排程系统&#xff09;自动排单软件的应用可以极大地提升生产效率、减少浪费、优化资源分配&#xff0c;并提高客户满意度。然而&#xff0c;在选择和实施APS自动排单软件时&#xff0c;企业需要注意以下几个关键点&#xff1a;…

高精密基准源 国产替代 REF191 ADR4520 ADR420 ADR430 ADR440 REF5020 MAX6126

高精密基准源 国产替代 REF191 ADR4520 ADR420 ADR430 ADR440 REF5020 MAX6126 ADR03 REF03 REF192 AD580 AD780 ADR441 ADR4525 ADR431 ADR421 REF5025ADR423 ADR433 ADR443 ADR4530 REF193 AD780 ADR06 REF5030ADR434 ADR444 ADR4540 REF198 REF5040ADR425 ADR435 ADR445 AD…

利用Python进行数据可视化Plotly与Dash的应用【第157篇—数据可视化】

&#x1f47d;发现宝藏 前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;忍不住分享一下给大家。【点击进入巨牛的人工智能学习网站】。 利用Python进行数据可视化Plotly与Dash的应用 数据可视化是数据分析中至关重要的一环&…

ONNX系列: ONNX模型结构解析

1. ONNX 背景 ONNX 全称为 Open Neural Network Exchange&#xff0c;是微软提出并推广的一种机器学习模型的开放格式表示。ONNX定义了一组通用的算子集、一系列用于构建深度学习模型的模块以及一种通用的文件格式&#xff0c;使得人工智能开发人员能够将模型与各种框…

JavaIO流与字节输出流OutputStream

1 概述 1.1 什么是IO流 IO流是存储和读取数据的解决方案&#xff0c;用于读写文件中的数据&#xff08;包括本地文件、网络等&#xff09; IO流的参照是程序或内存&#xff0c;即使程序在读&#xff0c;程序在写。 1.2 IO的分类 根据流的方向分为&#xff1a;输入流和输出流…

九州金榜|面对校园霸凌,家长应该如何教育?

近期关于校园霸凌事件接连发生&#xff0c;前有邯郸时间&#xff0c;后有福建晋江一中学生因不忍被霸凌&#xff0c;选择跳楼轻生&#xff0c;面对此类事件&#xff0c;接连发生&#xff0c;孩子为什么会成为被霸凌的对象&#xff1f;家长应该如何教育孩子敢于对霸凌时说不。下…

2024年第八届制造、材料与冶金工程国际会议(ICMMME 2024)即将召开!

2024年第八届制造、材料与冶金工程国际会议&#xff08;ICMMME 2024&#xff09;将于2024年7月12-14日在日本横滨举行。本次会议的目的是促进与会者之间的互动&#xff0c;汇聚对相关研究领域感兴趣的研究人员&#xff0c;工程师和从业人员。以了解这些领域的最新发展。为分享理…

PCB绘制时增加多层及生成GND的一些总结

1. 如何增加多层板? 【说明】由于GND大面积铺铜,常采用负片输出。因此选择“PLANE”,并勾选“negative”。 值得注意的是, 1)通常是每层之间会加一层介质,即绿色部分那个。 2)GND层通常与主器件层相邻。 2. 如何自动生成GND层? 首先使用Line命令,对不同GND进行分割…

电脑如何设置个性便签 电脑个性便签分享

每次坐在电脑前&#xff0c;我都仿佛置身于一片信息的海洋。工作、生活、学习&#xff0c;方方面面的事情都需要我用心去记录。在这样一个快节奏的时代&#xff0c;电脑无疑成了我最得力的助手。但记事的时候&#xff0c;我总希望有一个既方便又有个性的工具&#xff0c;能让我…

何恺明重提十年之争——模型表现好是源于能力提升还是捕获数据集偏置?

想象一下&#xff0c;如果把世界上所有的图片都找来&#xff0c;给它们放到一块巨大的空地上&#xff0c;其中内容相似的图片放得近一些&#xff0c;内容不相似的图片放得远一些&#xff08;类比向量嵌入&#xff09;。然后&#xff0c;我随机地向这片空地撒一把豆子&#xff0…

OpenHarmony之媒体组件模块简介

源码 本文基于OpenAtom OpenHarmony&#xff08;以下简称“OpenHarmony”&#xff09;3.2 Release源码foundation目录下的player_framework&#xff0c;在OpenHarmony 2.0 Release版本当中&#xff0c;这个模块的名字叫媒体组件模块&#xff0c;为了方便理解我们在本文中仍旧延…

【面试经典 | 150】单词拆分

文章目录 Tag题目来源解题思路方法一&#xff1a;动态规划 写在最后 Tag 【动态规划】【字符串】 题目来源 139. 单词拆分 解题思路 方法一&#xff1a;动态规划 定义状态 定义 dp[i] 表示字符串 s 前 i 个字符组成的字符串&#xff08;s[0, ..., i-1]&#xff09;是否能被…

0.96寸OLED屏调试 ----(二)

所需设备&#xff1a; 1、USB 转 SPI I2C 适配器&#xff1b;内附链接 2、0.96寸OLED显示模块&#xff1b; 备注&#xff1a;专业版、升级版都适用&#xff1b; 读写控制 SSD1306通过 D/C# 和 R/W# 两位来确定&#xff1a;读/写数据&#xff0c;写命令和读状态四种通信行为。…