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

字符串方法挑战

题目

编写一个程序,接收一个使用下划线命名法(underscore_case)编写的变量名列表,并将它们转换为驼峰命名法(camelCase)。
输入将来自插入到DOM中的文本区域(请参见下面的代码),在按下按钮时进行转换。
测试数据(粘贴到文本区域中)
underscore_case
first_name
Some_Variable
calculate_AGE
delayed_departure
应该输出以下内容(5个独立的console.log输出)

 underscoreCase            ✅ 
firstName                  ✅✅ 
someVariable               ✅✅✅ 
calculateAge               ✅✅✅✅ 
delayedDeparture           ✅✅✅✅✅

提示1:记住哪个字符定义了文本区域中的新行😉
提示2:解决方案只需要适用于由两个单词组成的变量,例如a_b
提示3:先不要担心✅。只有在变量名称转换正常工作后再处理它😉
提示4:这个挑战是故意设定为困难的,所以如果你卡住了,开始观看解决方案。然后暂停并继续!
之后,可以使用您自己的测试数据进行测试!
祝您好运 😀

document.body.append(document.createElement('textarea'));
document.body.append(document.createElement('button'));
const text = document.querySelector('textarea').value;

参考

document.body.append(document.createElement('textarea'));
document.body.append(document.createElement('button'));document.querySelector('button').addEventListener('click',function(){const text = document.querySelector('textarea').value;const rows = text.split('\n');for (const [i,row] of rows.entries()) {const [first, second] = row.toLowerCase().trim().split('_');const output = `${first}${second.replace(second[0],second[0].toUpperCase())}`;console.log(`${output.padEnd(20)}${'✅'.repeat(i+1)}`);}
})

在这里插入图片描述

注:
这段代码主要是通过JavaScript实现了以下功能:

  1. 动态创建了一个文本区域和一个按钮,并将它们添加到页面的元素中。
    ○ document.body.append(document.createElement(‘textarea’)) 创建了一个元素并将其添加到中。
    ○ document.body.append(document.createElement(‘button’)) 创建了一个元素并将其添加到中。
  2. 为按钮添加了一个点击事件监听器,当按钮被点击时执行相应的事件处理程序。
    ○ document.querySelector(‘button’) 选择器找到页面中的第一个元素。
    ○ .addEventListener(‘click’, function() { … }) 添加了一个点击事件监听器,并指定一个匿名函数作为事件处理程序。
  3. 在事件处理程序中,获取文本区域的值,并根据换行符拆分成多行文本。
    ○ const text = document.querySelector(‘textarea’).value 获取文本区域的值。
    ○ const rows = text.split(‘\n’) 使用换行符\n将文本拆分为多行,保存在rows数组中。
  4. 使用循环遍历每一行的文本,并对变量名进行转换。
    ○ for (const [i, row] of rows.entries()) { … } 使用for…of语法遍历rows数组的每一项,同时获取索引和当前行的值。
  5. 在每一行内部,使用下划线将变量名拆分为两部分,并将第二部分的首字母大写,然后合并为新的变量名。
    ○ const [first, second] = row.toLowerCase().trim().split(‘_’) 将当前行的文本转换为小写,去除前后空格,并使用下划线拆分为两个部分,保存在first和second中。
    ○ const output = first{second.replace(second[0], second[0].toUpperCase())}`` 将第一个部分first与第二个部分的首字母大写后的部分拼接为新的变量名output。
  6. 最后,输出转换后的变量名和相应的✅符号到控制台。
    ○ console.log(output.padEnd(20){‘✅’.repeat(i+1)}) 使用模板字符串将转换后的变量名和对应的✅符号输出到控制台。padEnd(20)使得变量名占据20个字符的宽度,然后使用’✅’.repeat(i+1)生成i+1个✅符号。
    这段代码涉及的JavaScript知识点包括DOM操作(动态创建元素、选择器、事件监听器)、字符串处理(大小写转换、拼接、填充)、数组迭代(for…of循环、entries()方法)、以及模板字符串的使用。

相关文章:

字符串方法挑战

题目 编写一个程序,接收一个使用下划线命名法(underscore_case)编写的变量名列表,并将它们转换为驼峰命名法(camelCase)。 输入将来自插入到DOM中的文本区域(请参见下面的代码)&…...

vivado FIR Filters

Vivado合成直接从RTL中推导出乘加级联来组成FIR滤波器。这种滤波器有几种可能的实现方式;一个例子是收缩滤波器在7系列DSP48E1 Slice用户指南(UG479)中进行了描述,并在8抽头偶数中显示对称收缩FIR(Verilog)…...

c# Contains方法-检查集合中是否包含指定的元素

Contains 是 .NET 集合框架中许多集合类&#xff08;如 List、Array、HashSet 等&#xff09;提供的一种方法&#xff0c;用于检查集合中是否包含指定的元素。对于 List<int> 类型&#xff0c;Contains 方法会遍历列表中的所有元素&#xff0c;并判断传入的方法参数是否存…...

【开源】在线办公系统 JAVA+Vue.js+SpringBoot+MySQL

目录 1 功能模块1.1 员工管理模块1.2 邮件管理模块1.3 人事档案模块1.4 公告管理模块 2 系统展示3 核心代码3.1 查询用户3.2 导入用户3.3 新增公告 4 免责声明 本文项目编号&#xff1a; T 001 。 \color{red}{本文项目编号&#xff1a;T001。} 本文项目编号&#xff1a;T001。…...

dubbo源码中设计模式——注册中心中工厂模式的应用

工厂模式的介绍 工厂模式提供了一种创建对象的方式&#xff0c;而无需指定要创建的具体类。 工厂模式属于创建型模式&#xff0c;它在创建对象时提供了一种封装机制&#xff0c;将实际创建对象的代码与使用代码分离。 应用场景&#xff1a;定义一个创建对象的接口&#xff0…...

T-Dongle-S3开发笔记——移植LVGL

添加lvgl组件 idf.py add-dependency lvgl/lvgl>8.* 新建终端执行命令后出现了新的文件&#xff1a; 清除再编译后才会出现lvgl库 优化为本地组件 以上方式修改了组件文件内容重新编译后文件又会变回去。 所以我们要把lvgl变成本地组件 1、要把 idf_component.yml 文…...

SOPHON算能科技新版SDK环境配置以及C++ demo使用过程

目录 1 SDK大包下载 2 获取SDK中的库文件和头文件 2.1 注意事项 2.2 交叉编译环境搭建 2.2.1 首先安装工具链 2.2.2 解压sophon-img包里的libsophon_soc__aarch64.tar.gz&#xff0c;将lib和include的所有内容拷贝到soc-sdk文件夹 2.2.3 解压sophon-mw包里的sophon-mw-s…...

Linux-SSH被攻击-解决方案

文章目录 一、检查攻击来源二、防范措施三、Fail2banfirewallcmd-ipset安装Fail2ban&#xff1a;安装firewalld&#xff1a;配置Fail2ban&#xff1a;配置firewalld以使用fail2ban&#xff1a;测试配置&#xff1a; SSH端口暴露在公网上很可能被黑客扫描&#xff0c;并尝试登入…...

第1章 计算机系统概述(2)

1.4操作系统结构 随着操作系统功能的不断增多和代码规模的不断变大,合理的操作系统结构,对于降低操作系统复杂度,提升操作系统安全与可靠性来说变得尤为重要。 分层法: 优点: 1.便于系统调试和验证,简化系统的设计和实现 2.易于扩充和维护 缺点: 1.合理定义各层较难(依赖关系比…...

【Java中23种设计模式-单例模式--饿汉式】

加油&#xff0c;新时代打工人&#xff01; 简单粗暴&#xff0c;直接上代码。 23种设计模式定义介绍 Java中23种设计模式-单例模式 Java中23种设计模式-单例模式2–懒汉式线程不安全 Java中23种设计模式-单例模式2–懒汉式2线程安全 package mode;/*** author wenhao* dat…...

基于JavaWeb实现的在线蛋糕商城

一、系统架构 前端&#xff1a;jsp | bootstrap | js | css 后端&#xff1a;servlet | mybatis 环境&#xff1a;jdk1.7 | mysql | maven | tomcat 二、代码及数据库 三、功能介绍 01. web页-首页 02. web页-商品分类 03. web页-热销 04. web页-新品 05. w…...

【Pytorch】各种维度变换函数总结

维度变换千万不要混着用&#xff0c;尤其是交换维度的transpose和更改观察视角的view或者reshape&#xff01;混用了以后虽然不会报错&#xff0c;但是数据是乱的, 建议用einops中的rearrange&#xff0c;符合人的直观&#xff0c;不容易出错。 一个例子&#xff1a; >>…...

typescript 泛型详解

typescript 泛型 泛型是可以在保证类型安全前提下&#xff0c;让函数等与多种类型一起工作&#xff0c;从而实现复用&#xff0c;常用于: 函数、接口、class中。 需求:创建一个id 函数&#xff0c;传入什么数据就返回该数据本身(也就是说&#xff0c;参数和返回值类型相同)。 …...

【Ubuntu内核】解决Ubuntu 20.04更新内核后无法联网的问题

最近在使用Ubuntu 20.04时&#xff0c;在更新内核后无法进行WiFi联网。我的电脑上装载的是AX211型号的无线网卡&#xff0c;之前安装了相应的驱动&#xff0c;并且一直正常使用。但不小心更新到了Linux 5.15.0-94-generic后&#xff0c;突然发现无法连接网络了。 于是首先怀疑…...

20-k8s中pod的调度-nodeSelector节点选择器

一、概念 我们先创建一个普通的deploy资源&#xff0c;设置为10个副本 [rootk8s231 dns]# cat deploy.yaml apiVersion: apps/v1 kind: Deployment metadata: name: dm01 spec: replicas: 10 selector: matchLabels: k8s: k8s template: metadata: …...

win10下wsl2使用记录(系统迁移到D盘、配置国内源、安装conda环境、配置pip源、安装pytorch-gpu环境、安装paddle-gpu环境)

wsl2 安装好后环境测试效果如下&#xff0c;支持命令nvidia-smi&#xff0c;不支持命令nvcc&#xff0c;usr/local目录下没有cuda文件夹。 系统迁移到非C盘 wsl安装的系统默认在c盘&#xff0c;为节省c盘空间进行迁移。 1、输出wsl -l 查看要迁移的系统名称 2、执行导出命…...

数据结构与算法:栈

朋友们大家好啊&#xff0c;在链表的讲解过后&#xff0c;我们本节内容来介绍一个特殊的线性表&#xff1a;栈&#xff0c;在讲解后也会以例题来加深对本节内容的理解 栈 栈的介绍栈进出栈的变化形式 栈的顺序存储结构的有关操作栈的结构定义与初始化压栈操作出栈操作获取栈顶元…...

Newtonsoft.Json设置忽略某些字段

using Newtonsoft.Json; using Newtonsoft.Json.Serialization; using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.Threading.Tasks;namespace TestProject1 {/// <summary>/// 输出json时&#xff0c;设置忽略哪些…...

【c++每天一题】跳跃游戏

题目 给你一个非负整数数组 nums &#xff0c;你最初位于数组的 第一个下标 。数组中的每个元素代表你在该位置可以跳跃的最大长度。 判断你是否能够到达最后一个下标&#xff0c;如果可以&#xff0c;返回 true &#xff1b;否则&#xff0c;返回 false 。 示例 1&#xff1…...

【C# 中抓取包含多个屏幕内容的整个桌面】

要在 C# 中抓取包含多个屏幕内容的整个桌面&#xff0c;可以使用 .NET Framework 或者其他第三方库来实现。一种常见的方法是使用 System.Windows.Forms 和 System.Drawing 命名空间中的类来实现屏幕截图。以下是一个示例代码&#xff0c;演示如何抓取包含多个屏幕内容的整个桌…...

Qclaw 效率工作流实战测评:让微信变成你的「远程生产力中枢」

一句微信消息&#xff0c;驱动电脑自动干活——这不是概念片&#xff0c;是我用了两周 Qclaw 后的真实体感。 一、Qclaw 是什么&#xff1f;30 秒讲清楚 qclaw Qclaw 是腾讯电脑管家团队出品的个人 AI Agent 工具&#xff0c;基于开源框架 OpenClaw 封装而成。核心逻辑用一句…...

2025届学术党必备的降重复率网站横评

Ai论文网站排名&#xff08;开题报告、文献综述、降aigc率、降重综合对比&#xff09; TOP1. 千笔AI TOP2. aipasspaper TOP3. 清北论文 TOP4. 豆包 TOP5. kimi TOP6. deepseek 研究人工智能开题报告的工具&#xff0c;借助自然语言处理技术&#xff0c;靠着学术大数据分…...

Android Studio中利用fat-aar实现多级依赖aar的合并打包实战

1. 为什么需要fat-aar合并打包 在Android开发中&#xff0c;我们经常会遇到这样的场景&#xff1a;你开发了一个功能模块&#xff08;比如天气组件Weather.aar&#xff09;&#xff0c;这个模块又依赖了第三方aar&#xff08;比如图表库Chart.aar&#xff09;。当你把Weather.a…...

计算机毕业设计springboot在线阅读平台的设计与实现 基于SpringBoot的数字化图书阅读与积分兑换服务平台 SpringBoot框架下的网络文献资源管理与读者互动系统

计算机毕业设计springboot在线阅读平台的设计与实现 &#xff08;配套有源码 程序 mysql数据库 论文&#xff09; 本套源码可以在文本联xi,先看具体系统功能演示视频领取&#xff0c;可分享源码参考。 随着互联网技术的飞速发展和移动智能终端的普及&#xff0c;人们的阅读习惯…...

颈椎病反复复发?终于找到根源解决办法

颈椎疼治好了又犯&#xff0c;花钱不少、遭罪不少&#xff0c;到底为啥&#xff1f;核心就两点&#xff1a;只止疼不修病灶、纤维环破裂没修复。 普通治疗只能暂时推开压迫&#xff0c;髓核还会再次突出&#xff0c;神经反复受刺激&#xff0c;酸痛麻木永远断不了根。长春颈椎腰…...

告别键盘连击烦恼:这款开源工具让你的机械键盘重获新生

告别键盘连击烦恼&#xff1a;这款开源工具让你的机械键盘重获新生 【免费下载链接】KeyboardChatterBlocker A handy quick tool for blocking mechanical keyboard chatter. 项目地址: https://gitcode.com/gh_mirrors/ke/KeyboardChatterBlocker 还在为键盘连击问题而…...

2026届毕业生推荐的AI科研平台横评

Ai论文网站排名&#xff08;开题报告、文献综述、降aigc率、降重综合对比&#xff09; TOP1. 千笔AI TOP2. aipasspaper TOP3. 清北论文 TOP4. 豆包 TOP5. kimi TOP6. deepseek 已然被广泛应用于毕业论文写作进程之中的是人工智能技术&#xff0c;学生借助自然语言生成模…...

别再傻傻分不清了!LDO和DC-DC到底怎么选?从效率、温升到选型实战一次讲透

LDO与DC-DC终极选型指南&#xff1a;从理论到实战的完整决策框架 在硬件设计领域&#xff0c;电源方案的选择往往决定了整个系统的稳定性与能效表现。面对LDO&#xff08;低压差线性稳压器&#xff09;和DC-DC&#xff08;直流-直流转换器&#xff09;这两大主流方案&#xff0…...

北京资深的环保装修工作室哪家靠谱

很多在北京的朋友装修时特别注重环保问题&#xff0c;尤其是年轻人第一次装修&#xff0c;最怕“被坑”&#xff0c;效果图是“照骗”&#xff0c;报价是“诱饵”&#xff0c;增项是“无底洞”。这里给大家推荐鲁艺堂&#xff08;北京&#xff09;建筑装饰工程有限公司&#xf…...

暗黑破坏神2存档编辑器:安全高效的d2s文件修改与角色属性调整工具

暗黑破坏神2存档编辑器&#xff1a;安全高效的d2s文件修改与角色属性调整工具 【免费下载链接】d2s-editor 项目地址: https://gitcode.com/gh_mirrors/d2/d2s-editor 暗黑破坏神2存档编辑器&#xff08;d2s-editor&#xff09;是一款专为《暗黑破坏神2》玩家设计的开源…...