在ChatGPT编程超能力面前你真的认为自己能一口气掌握它的全貌吗13个精华章节50个实例等着你去解
在编程的世界里,ChatGPT无疑是一位强大的助手,它能够帮助你快速完成各种任务。通过它,你可以生成HTML和CSS代码,甚至是复杂的JavaScript函数。这不仅能提高你的工作效率,还能让你的项目更加完善。
1.1 提示词:
使用ChatGPT创建一个具有[组件部分]的语义化HTML和[Tailwind CSS框架]样式UI组件,使其布局为[布局]。
举例:
使用ChatGPT创建一个包含用户姓名、电子邮件地址、问题类型以及留言内容的语义化HTML和Tailwind CSS表单,该表单应将各个元素垂直堆叠,并放置于卡片内。
生成结果:
<form class="card">
<div class="form-group mb-3">
<label for="name">Name:</label>
<input type="text" id="name" name="name" required>
</div>
<div class="form-group mb-3">
<label for="email">Email:</label>
<input type="email" id="email" name="email" required>
</div>
<!-- 其他字段 -->
</form>
1.2 提示词:
编写一个接受[input]并返回[output]的JavaScript函数。
举例:
编写一个接受全名作为输入并返回头像字母的JavaScript函数。
生成结果:
function getAvatarLetters(fullName) {
const names = fullName.trim().split(' ');
let avatar = '';
// 遍历每个名字并将其第一个字符添加到头像中
for (let i = 0; i <= Math.min(names.length, AvatarLength); i++) {
avatar += names[i][0];
if (avatar.length >= AvatarLength) break;
if (i + 1 < names.length && !names[i + ''].match(RegExp)) continue;
avatar += ' ';
// 返回头像
return avatar;
}
这个函数首先分割全名为名字和姓氏,然后遍历每个名字并将其第一个字符添加到头像中。如果头像长度超过了设定的最大长度,则截断以保持在两个字符之内。最后,该函数返回所需数量的人物符号。
例如,如果输入的是“张三”,则该功能会返回“张”,而如果输入的是“张三丰”,则它会返回“张”、“三”。