编程开发新朋友 —— ChatGPT 和 NotionAI 实战

语言: CN / TW / HK

废话少说,本篇带来借助 AI 帮助我们编程开发的 4 种场景实战,分别是:

1、AI 代码释义

2、AI 完善代码

3、AI 修正代码

4、AI 测试代码

问答来源于 ChatGPT 和 NotionAI,相信你一定能感受到 AIGC 的魅力~

喜欢三连,笔芯~

image.png

关联阅读:为什么我更推荐 Notion AI 胜于 ChatGPT ? - 掘金

AI 代码释义

⭐输入:

//解释下以下代码是干嘛的 function calculateDistance(x1, y1, x2, y2) { return Math.sqrt(Math.pow(x1 - x2, 2) + Math.pow(y1 - y2, 2)); }

ChatGPT

image.png

输出:

这段代码是计算两个点之间的欧几里得距离的函数。其中,(x1, y1) 和 (x2, y2) 表示两个点的坐标,函数通过使用勾股定理计算出它们之间的距离并返回结果。

NotionAI

image.png

输出:

函数calculateDistance(x1, y1, x2, y2) 用于计算两个点之间的距离,其中x1和y1表示第一个点的坐标,x2和y2表示第二个点的坐标。该函数使用勾股定理计算两点之间的距离,即通过求平方根来计算 (x1 - x2)^2 + (y1 - y2)^2 的值。


多补充一个例子:

⭐输入:

//为以下函数写注释 const debounce = (func, wait) => { let timer return () => { clearTimeout(timer) timer = setTimeout(func, wait); } }

ChatGPT 输出:

这是一个 JavaScript 实现的防抖动函数。防抖动函数接受两个参数:"func" 和 "wait"。"func" 参数表示在等待 "wait" 指定的时间后要执行的函数。

防抖动函数返回一个匿名函数,该匿名函数设置了一个计时器。如果计时器已存在,则会使用 "clearTimeout(timer)" 来清除它。然后,使用 "setTimeout(func, wait)" 设置新的计时器,确保即使在指定的时间段内多次调用该匿名函数,也只会在等待时间过后执行一次 "func" 函数。

NotionAI 输出:

// debounce函数用来限制函数调用的频率。

// 它返回一个匿名函数,在指定的等待时间后调用传入的函数,并且清除上一次的计时器。

AI 完善代码

⭐输入:

// 根据以下代码生成新代码 const className = "my-div"; const text = "Hello world!";

ChatGPT

image.png

输出:

const element = document.createElement("div"); element.className = className; element.textContent = text; document.body.appendChild(element);

NotionAI

image.png

输出: ``` // Styling a div with a class

Hello world!

```

AI 修正代码

⭐输入:

// 修正以下代码错误 function List(props) { const items = props.items; // error: items is undefined return ( <ul> {items.map(item => ( <li key={item.id}>{item.name}</li> ))} </ul> ); }

ChatGPT

image.png

输出:

// Here is the corrected code: function List(props) { const { items = [] } = props; return ( <ul> {items.map(item => ( <li key={item.id}>{item.name}</li> ))} </ul> ); } In this code, the props object is destructured to get the items property. If props doesn't have an items property, it will default to an empty array [].

它也给 items 设置了默认值,太强了!


NotionAI

image.png

输出: function List(props) { const items = props.items; if (items && items.length > 0) { return ( <ul> {items.map(item => ( <li key={item.id}>{item.name}</li> ))} </ul> ); } return null; }

Notion AI 一样能修复代码,做了条件判断,太强了!

AI 测试代码

⭐输入:

// 给以下代码做测试 const testCases = [ {length: 2, width: 3, expected: 6}, {length: 4, width: 5, expected: 20}, {length: 6, width: 7, expected: 42}, ];

ChatGPT

image.png

输出:

Here is a sample code for testing the given test cases: ```

function testAreaCalculation(testCases) { for (let i = 0; i < testCases.length; i++) { const { length, width, expected } = testCases[i]; const result = length * width; if (result !== expected) { console.error(Test case ${i} failed: expected ${expected} but got ${result}); } else { console.log(Test case ${i} passed); } } }

testAreaCalculation(testCases); ``` This code will run through all the test cases and print out "Test case i passed" for each test case that passes and "Test case i failed: expected expectedValue but got result" for each test case that fails.

回答生成了一个健全的代码测试用例;

NotionAI

image.png

输出:

testCases.forEach((testCase) => { const area = calculateArea(testCase.length, testCase.width); expect(area).toBe(testCase.expected); });

小结

最后用 Notion AI 为本篇作一个小结:

image.png

TIME.


OK,以上便是本篇分享,希望各位工友喜欢~ 欢迎点赞、收藏、评论 🤟

我是掘金安东尼 🤠 100 万人气前端技术博主 💥 INFP 写作人格坚持 1000 日更文 ✍ 关注我,安东尼陪你一起度过漫长编程岁月 🌏

😹 加我微信 ATAR53,拉你入群,定期抽奖、粉丝福利多多。只学习交友、不推文卖课~