当前位置: 首页 > 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()方法)、以及模板字符串的使用。
http://www.lryc.cn/news/303239.html

相关文章:

  • vivado FIR Filters
  • c# Contains方法-检查集合中是否包含指定的元素
  • 【开源】在线办公系统 JAVA+Vue.js+SpringBoot+MySQL
  • dubbo源码中设计模式——注册中心中工厂模式的应用
  • T-Dongle-S3开发笔记——移植LVGL
  • SOPHON算能科技新版SDK环境配置以及C++ demo使用过程
  • Linux-SSH被攻击-解决方案
  • 第1章 计算机系统概述(2)
  • 【Java中23种设计模式-单例模式--饿汉式】
  • 基于JavaWeb实现的在线蛋糕商城
  • 【Pytorch】各种维度变换函数总结
  • typescript 泛型详解
  • 【Ubuntu内核】解决Ubuntu 20.04更新内核后无法联网的问题
  • 20-k8s中pod的调度-nodeSelector节点选择器
  • win10下wsl2使用记录(系统迁移到D盘、配置国内源、安装conda环境、配置pip源、安装pytorch-gpu环境、安装paddle-gpu环境)
  • 数据结构与算法:栈
  • Newtonsoft.Json设置忽略某些字段
  • 【c++每天一题】跳跃游戏
  • 【C# 中抓取包含多个屏幕内容的整个桌面】
  • 数据库管理-第152期 Oracle Vector DB AI-04(20240220)
  • uniapp app端水印组件封装 一次引入版
  • 最新Unity游戏主程进阶学习大纲(2个月)
  • NoSQL 数据库管理工具,搭载强大支持:Redis、Memcached、SSDB、LevelDB、RocksDB,为您的数据存储提供无与伦比的灵活性与性能!
  • 基于Spring Boot的多级缓存系统设计
  • k8s-配置与存储-配置管理
  • c语言实现bellman-ford算法
  • socket与rpc的区别
  • 10、内网安全-横向移动域控提权NetLogonADCSPACKDC永恒之蓝
  • 代码随想录算法训练营第三八天 | 动态规划
  • 【ubuntu2004安装N卡驱动】