文章目錄一、為什么“幫我寫(xiě)代碼”通常不夠清楚二、描述需求的第一個(gè)要素背景背景通常包含什么為什么背景很重要背景不要寫(xiě)得過(guò)多三、描述需求的第二個(gè)要素目標(biāo)不夠具體的目標(biāo)更清楚的目標(biāo)目標(biāo)最好包含“做什么”和“不做什么”四、描述需求的第三個(gè)要素限制常見(jiàn)的限制類型1. 技術(shù)限制2. 修改范圍限制3. 功能范圍限制4. 輸出限制5. 安全和數(shù)據(jù)限制不確定的內(nèi)容不要讓 AI 自行猜五、描述需求的第四個(gè)要素輸出格式只要求“給我代碼”明確輸出步驟不同任務(wù)可以要求不同輸出學(xué)習(xí)代碼生成小功能排查報(bào)錯(cuò)修改已有代碼六、把 4 個(gè)要素組合起來(lái)原始需求補(bǔ)充背景補(bǔ)充目標(biāo)補(bǔ)充限制補(bǔ)充輸出格式組合后的完整需求七、不同場(chǎng)景下的需求描述模板模板一讓 AI 解釋代碼模板二讓 AI 生成一個(gè)函數(shù)模板三讓 AI 修改已有代碼模板四讓 AI 排查報(bào)錯(cuò)八、描述需求時(shí)最容易犯的 4 個(gè)錯(cuò)誤錯(cuò)誤一目標(biāo)太抽象錯(cuò)誤二把多個(gè)大任務(wù)混在一起錯(cuò)誤三只說(shuō)技術(shù)不說(shuō)結(jié)果錯(cuò)誤四只說(shuō)結(jié)果不說(shuō)明學(xué)習(xí)階段九、提交需求前的快速檢查十、總結(jié)?創(chuàng)作者全棧弄潮兒 個(gè)人主頁(yè)全棧弄潮兒的個(gè)人主頁(yè)? 個(gè)人社區(qū)歡迎你的加入全棧開(kāi)發(fā)社區(qū) 專欄地址歡迎訂閱AI 編程提效實(shí)戰(zhàn)前面幾篇文章中我們反復(fù)提到一個(gè)觀點(diǎn)AI 輸出得好不好和我們描述問(wèn)題的方式有很大關(guān)系。很多人第一次向 AI 提問(wèn)時(shí)通常只會(huì)說(shuō)幫我寫(xiě)一個(gè)待辦事項(xiàng)功能。AI 確實(shí)可以生成代碼。但這段代碼很可能和你的實(shí)際需求不一致因?yàn)?AI 不知道你使用什么技術(shù)棧。你想實(shí)現(xiàn)哪些具體功能。數(shù)據(jù)應(yīng)該保存在哪里。哪些功能暫時(shí)不需要。你希望 AI 輸出代碼還是先解釋思路。這不是 AI 故意回答得不好而是問(wèn)題本身留下了太多需要猜測(cè)的地方。今天我們就來(lái)學(xué)習(xí)一個(gè)非常實(shí)用的能力如何向 AI 清楚描述一個(gè)編程需求讓它少猜一點(diǎn)、少返工一點(diǎn)。本文不會(huì)要求你學(xué)習(xí)復(fù)雜的 Prompt 術(shù)語(yǔ)。只要記住 4 個(gè)要素背景 ↓ 目標(biāo) ↓ 限制 ↓ 輸出格式一、為什么“幫我寫(xiě)代碼”通常不夠清楚我們先看一個(gè)很短的需求幫我寫(xiě)一個(gè)用戶登錄頁(yè)面。這句話看起來(lái)很明確但真正開(kāi)始實(shí)現(xiàn)時(shí)還有很多問(wèn)題沒(méi)有答案使用 Vue、React還是原生 HTML頁(yè)面需要哪些輸入框登錄使用賬號(hào)密碼還是手機(jī)號(hào)驗(yàn)證碼用戶名和密碼是否必填密碼是否需要顯示和隱藏切換登錄成功后跳轉(zhuǎn)到哪里登錄失敗后如何提示是否需要顯示加載狀態(tài)是否需要調(diào)用真實(shí)接口是否需要保存登錄狀態(tài)如果你不補(bǔ)充這些信息AI 就必須自行選擇。它可能生成一個(gè)簡(jiǎn)單的靜態(tài)頁(yè)面也可能生成一個(gè)帶路由、接口、狀態(tài)管理和第三方組件庫(kù)的復(fù)雜實(shí)現(xiàn)。兩種結(jié)果都可能“看起來(lái)合理”但未必符合你的目標(biāo)。所以問(wèn)題不一定是AI 為什么沒(méi)有按照我的想法寫(xiě)也可能是我有沒(méi)有把自己的想法說(shuō)完整二、描述需求的第一個(gè)要素背景背景是告訴 AI你現(xiàn)在處于什么環(huán)境要解決什么類型的問(wèn)題。背景不需要寫(xiě)成一篇項(xiàng)目介紹只需要提供和當(dāng)前任務(wù)有關(guān)的信息。背景通常包含什么根據(jù)任務(wù)不同可以提供使用的編程語(yǔ)言。使用的框架或運(yùn)行環(huán)境。當(dāng)前項(xiàng)目的大致類型。相關(guān)文件或模塊。你目前的學(xué)習(xí)階段。已經(jīng)完成了哪些內(nèi)容。例如我正在學(xué)習(xí) JavaScript使用 Node.js 運(yùn)行代碼。 目前只會(huì)使用變量、函數(shù)、數(shù)組和條件判斷。 我想通過(guò)一個(gè)小練習(xí)理解如何讀取和處理文件。如果是一個(gè)已有項(xiàng)目可以這樣描述這是一個(gè) Vue 3 JavaScript 的待辦事項(xiàng)項(xiàng)目。 頁(yè)面代碼位于 src/components/TodoList.vue。 當(dāng)前已經(jīng)可以展示待辦列表本次只想增加刪除功能。 項(xiàng)目使用 npm 管理依賴不希望新增第三方庫(kù)。為什么背景很重要同一個(gè)需求在不同環(huán)境中的實(shí)現(xiàn)方式可能不同。例如“讀取文件”瀏覽器中需要考慮文件選擇器和用戶權(quán)限。Node.js 中可以使用文件系統(tǒng)模塊。Python 中有自己的文件操作方式。移動(dòng)端還需要考慮平臺(tái)權(quán)限。如果不說(shuō)明背景AI 只能給出一個(gè)通用答案。通用答案適合學(xué)習(xí)概念但不一定能直接放進(jìn)你的項(xiàng)目。背景不要寫(xiě)得過(guò)多提供背景不等于把整個(gè)項(xiàng)目全部復(fù)制給 AI。如果你只是想學(xué)習(xí)一個(gè)數(shù)組方法不需要把整個(gè)項(xiàng)目目錄、所有配置和無(wú)關(guān)代碼都發(fā)過(guò)去?？梢宰裱粋€(gè)簡(jiǎn)單原則只提供完成當(dāng)前任務(wù)必須知道的背景。例如我使用 JavaScript。 下面有一個(gè)用戶數(shù)組。 我想篩選出年齡大于 18 歲的用戶。這些信息已經(jīng)足夠 AI 解釋filter的用法。三、描述需求的第二個(gè)要素目標(biāo)目標(biāo)是告訴 AI這一次具體要完成什么。目標(biāo)越具體AI 越容易判斷工作范圍。不夠具體的目標(biāo)幫我優(yōu)化一下頁(yè)面。“優(yōu)化”可能代表很多事情讓頁(yè)面加載更快。讓樣式更好看。讓手機(jī)端適配更好。減少重復(fù)代碼。提高代碼可讀性。修復(fù)一個(gè)具體的交互問(wèn)題。如果沒(méi)有進(jìn)一步說(shuō)明AI 可能按照自己的理解進(jìn)行大范圍修改。更清楚的目標(biāo)請(qǐng)優(yōu)化待辦事項(xiàng)列表的移動(dòng)端顯示效果。 本次只調(diào)整 CSS不修改 JavaScript 邏輯。 要求 1. 屏幕寬度小于 600px 時(shí)列表不要出現(xiàn)橫向滾動(dòng)。 2. 每條待辦事項(xiàng)的文字過(guò)長(zhǎng)時(shí)可以換行。 3. 刪除按鈕保持在每條記錄的右側(cè)。這個(gè)目標(biāo)就比較清楚了優(yōu)化對(duì)象是待辦事項(xiàng)列表。使用場(chǎng)景是移動(dòng)端。修改范圍是 CSS。不允許修改 JavaScript。有明確的驗(yàn)收條件。目標(biāo)最好包含“做什么”和“不做什么”很多返工都來(lái)自范圍不清。所以描述目標(biāo)時(shí)可以同時(shí)寫(xiě)本次要做 - 增加待辦事項(xiàng)刪除功能。 本次不做 - 不增加編輯功能。 - 不修改數(shù)據(jù)存儲(chǔ)方式。 - 不重構(gòu)現(xiàn)有列表組件。明確不做什么同樣重要。四、描述需求的第三個(gè)要素限制限制是告訴 AI哪些事情必須遵守哪些事情不能自行決定。沒(méi)有限制時(shí)AI 往往會(huì)選擇它認(rèn)為方便的實(shí)現(xiàn)方式。常見(jiàn)的限制類型1. 技術(shù)限制- 只使用原生 JavaScript。 - 不使用第三方庫(kù)。 - 使用項(xiàng)目現(xiàn)有的 axios 封裝。 - 兼容 Node.js 18。2. 修改范圍限制- 只修改 LoginForm.vue。 - 不修改路由配置。 - 不修改數(shù)據(jù)庫(kù)結(jié)構(gòu)。 - 不重命名現(xiàn)有接口。3. 功能范圍限制- 本次只實(shí)現(xiàn)新增不實(shí)現(xiàn)編輯和刪除。 - 只處理未完成的待辦事項(xiàng)。 - 暫時(shí)不接入真實(shí)登錄接口。4. 輸出限制- 先解釋思路再給代碼。 - 代碼拆分成三個(gè)文件。 - 每段代碼后說(shuō)明如何運(yùn)行。 - 只輸出需要修改的部分不要重復(fù)整個(gè)項(xiàng)目。5. 安全和數(shù)據(jù)限制- 不要在日志中打印密碼和令牌。 - 不要使用真實(shí)用戶數(shù)據(jù)。 - 不要把密鑰寫(xiě)死在前端代碼中。 - 用戶輸入必須經(jīng)過(guò)基本校驗(yàn)。不確定的內(nèi)容不要讓 AI 自行猜如果你不知道某條規(guī)則也可以直接告訴 AI下面這條業(yè)務(wù)規(guī)則我還沒(méi)有確認(rèn)。 請(qǐng)先把它列為待確認(rèn)問(wèn)題不要自行選擇一種實(shí)現(xiàn)。例如訂單支付成功后是否允許取消目前還沒(méi)有確定。 請(qǐng)?jiān)诜桨钢袉为?dú)列出這個(gè)問(wèn)題。這樣可以避免 AI 把一個(gè)猜測(cè)寫(xiě)進(jìn)代碼之后又被當(dāng)成了正式規(guī)則。五、描述需求的第四個(gè)要素輸出格式輸出格式是告訴 AI你希望它用什么方式回答。同一個(gè)需求輸出格式不同結(jié)果的可用性也會(huì)不同。只要求“給我代碼”幫我寫(xiě)一個(gè)讀取 CSV 文件的程序。AI 可能只返回一段代碼。如果你是初學(xué)者可能還不知道代碼應(yīng)該保存成什么文件。需要安裝什么環(huán)境。如何運(yùn)行。輸入文件放在哪里。輸出結(jié)果是什么。明確輸出步驟請(qǐng)按以下順序回答 1. 先用簡(jiǎn)單語(yǔ)言解釋實(shí)現(xiàn)思路。 2. 說(shuō)明需要準(zhǔn)備的文件和目錄。 3. 給出完整代碼。 4. 說(shuō)明如何運(yùn)行。 5. 給出一份示例輸入和預(yù)期輸出。 6. 列出 3 個(gè)常見(jiàn)錯(cuò)誤及排查方法。這種格式特別適合初學(xué)者。不同任務(wù)可以要求不同輸出學(xué)習(xí)代碼請(qǐng)先解釋概念再給一個(gè)最小示例。 逐行說(shuō)明關(guān)鍵代碼并給出可以修改的練習(xí)。生成小功能請(qǐng)先復(fù)述需求再給出實(shí)現(xiàn)思路和代碼。 最后列出運(yùn)行步驟和測(cè)試場(chǎng)景。排查報(bào)錯(cuò)請(qǐng)先解釋報(bào)錯(cuò)含義。 再按可能性從高到低列出原因和排查步驟。 不要直接猜一個(gè)結(jié)論。修改已有代碼請(qǐng)先說(shuō)明準(zhǔn)備修改哪些地方。 只修改與當(dāng)前需求相關(guān)的代碼。 不要重寫(xiě)無(wú)關(guān)部分。 修改后說(shuō)明可能影響的功能。輸出格式越明確你越容易閱讀、檢查和使用 AI 的回答。六、把 4 個(gè)要素組合起來(lái)下面用一個(gè)具體需求把背景、目標(biāo)、限制和輸出格式組合起來(lái)。原始需求幫我做一個(gè)待辦事項(xiàng)功能。這句話太寬泛AI 需要自行猜測(cè)很多內(nèi)容。補(bǔ)充背景我正在學(xué)習(xí)原生 HTML、CSS 和 JavaScript。 目前已經(jīng)可以創(chuàng)建一個(gè)網(wǎng)頁(yè)并使用 JavaScript 操作按鈕點(diǎn)擊事件。 我想通過(guò)一個(gè)小項(xiàng)目練習(xí)數(shù)組和 DOM 操作。補(bǔ)充目標(biāo)請(qǐng)實(shí)現(xiàn)一個(gè)簡(jiǎn)單的待辦事項(xiàng)列表。 用戶可以輸入待辦內(nèi)容點(diǎn)擊按鈕后把它添加到列表中。 每條待辦事項(xiàng)旁邊顯示一個(gè)刪除按鈕。補(bǔ)充限制要求 1. 只使用原生 HTML、CSS 和 JavaScript。 2. 不使用第三方庫(kù)。 3. 本次不接入數(shù)據(jù)庫(kù)。 4. 待辦內(nèi)容為空時(shí)不能添加。 5. 只修改新增和刪除不實(shí)現(xiàn)編輯功能。補(bǔ)充輸出格式請(qǐng)按以下格式輸出 1. 先解釋實(shí)現(xiàn)思路。 2. 分別給出 index.html、style.css 和 app.js。 3. 說(shuō)明每個(gè)文件的作用。 4. 說(shuō)明如何在瀏覽器中運(yùn)行。 5. 列出正常輸入、空輸入和連續(xù)刪除的測(cè)試方法。 6. 代碼要適合初學(xué)者閱讀避免不必要的復(fù)雜寫(xiě)法。組合后的完整需求我正在學(xué)習(xí)原生 HTML、CSS 和 JavaScript。 目前已經(jīng)可以創(chuàng)建一個(gè)網(wǎng)頁(yè)并使用 JavaScript 操作按鈕點(diǎn)擊事件。 我想通過(guò)一個(gè)小項(xiàng)目練習(xí)數(shù)組和 DOM 操作。 請(qǐng)實(shí)現(xiàn)一個(gè)簡(jiǎn)單的待辦事項(xiàng)列表。 用戶可以輸入待辦內(nèi)容點(diǎn)擊按鈕后把它添加到列表中。 每條待辦事項(xiàng)旁邊顯示一個(gè)刪除按鈕。 要求 1. 只使用原生 HTML、CSS 和 JavaScript。 2. 不使用第三方庫(kù)。 3. 本次不接入數(shù)據(jù)庫(kù)。 4. 待辦內(nèi)容為空時(shí)不能添加。 5. 只修改新增和刪除不實(shí)現(xiàn)編輯功能。 請(qǐng)按以下格式輸出 1. 先解釋實(shí)現(xiàn)思路。 2. 分別給出 index.html、style.css 和 app.js。 3. 說(shuō)明每個(gè)文件的作用。 4. 說(shuō)明如何在瀏覽器中運(yùn)行。 5. 列出正常輸入、空輸入和連續(xù)刪除的測(cè)試方法。 6. 代碼要適合初學(xué)者閱讀避免不必要的復(fù)雜寫(xiě)法。相比最開(kāi)始的一句話這個(gè)版本已經(jīng)明確了學(xué)習(xí)背景。技術(shù)環(huán)境。具體功能。本次范圍。不做的內(nèi)容。代碼組織方式。運(yùn)行和測(cè)試要求。AI 得到的信息越完整越容易給出符合預(yù)期的回答。七、不同場(chǎng)景下的需求描述模板模板一讓 AI 解釋代碼我正在學(xué)習(xí) [編程語(yǔ)言或框架]。 下面是一段代碼 [粘貼代碼] 請(qǐng)完成以下任務(wù) 1. 用初學(xué)者能理解的語(yǔ)言說(shuō)明整體作用。 2. 逐段解釋關(guān)鍵代碼。 3. 說(shuō)明每個(gè)輸入和輸出。 4. 指出可能出現(xiàn)的錯(cuò)誤。 5. 給我一個(gè)可以自己修改的練習(xí)。模板二讓 AI 生成一個(gè)函數(shù)我使用 [語(yǔ)言和版本]。 請(qǐng)實(shí)現(xiàn)一個(gè) [函數(shù)功能]。 背景 [說(shuō)明函數(shù)會(huì)被用在哪里] 要求 - 輸入是 [參數(shù)和類型] - 輸出是 [返回值和類型] - [業(yè)務(wù)規(guī)則或限制] - [異常輸入如何處理] 請(qǐng)先解釋思路再給代碼。 最后提供正常、邊界和異常測(cè)試示例。模板三讓 AI 修改已有代碼這是當(dāng)前代碼 [粘貼相關(guān)代碼] 我想解決的問(wèn)題 [說(shuō)明當(dāng)前問(wèn)題] 項(xiàng)目背景 [技術(shù)棧、文件位置和相關(guān)規(guī)則] 限制 1. 只修改與當(dāng)前問(wèn)題相關(guān)的部分。 2. 不新增第三方依賴。 3. 不改變已有功能的輸入和輸出。 請(qǐng)先說(shuō)明問(wèn)題原因和修改計(jì)劃。 確認(rèn)后再給出修改后的代碼。模板四讓 AI 排查報(bào)錯(cuò)我在 [操作步驟] 時(shí)遇到了下面的報(bào)錯(cuò) [粘貼完整報(bào)錯(cuò)] 相關(guān)代碼 [粘貼報(bào)錯(cuò)位置附近的代碼] 環(huán)境信息 - 操作系統(tǒng) - 運(yùn)行環(huán)境版本 - 框架或庫(kù)版本 我已經(jīng)嘗試過(guò) [列出已經(jīng)嘗試的處理方式] 請(qǐng) 1. 解釋報(bào)錯(cuò)含義。 2. 列出最可能的原因。 3. 按順序給出排查步驟。 4. 說(shuō)明還需要哪些信息。八、描述需求時(shí)最容易犯的 4 個(gè)錯(cuò)誤錯(cuò)誤一目標(biāo)太抽象幫我優(yōu)化一下。 幫我完善一下。 幫我做得更好看。改成請(qǐng)優(yōu)化登錄表單的移動(dòng)端布局。 只修改 CSS不修改交互邏輯。 當(dāng)屏幕寬度小于 600px 時(shí)表單內(nèi)容不能出現(xiàn)橫向滾動(dòng)。錯(cuò)誤二把多個(gè)大任務(wù)混在一起幫我把這個(gè)項(xiàng)目的登錄、支付、訂單和后臺(tái)管理全部做完。改成本次只實(shí)現(xiàn)登錄頁(yè)面的表單校驗(yàn)。 登錄接口和登錄成功后的跳轉(zhuǎn)放到下一步。任務(wù)越小越容易理解和驗(yàn)證。錯(cuò)誤三只說(shuō)技術(shù)不說(shuō)結(jié)果用 React 寫(xiě)一個(gè)組件。還需要說(shuō)明這個(gè)組件用于展示待辦事項(xiàng)。 需要接收 items 和 onDelete 兩個(gè)參數(shù)。 每條記錄顯示標(biāo)題、完成狀態(tài)和刪除按鈕。技術(shù)棧只能說(shuō)明“用什么寫(xiě)”不能說(shuō)明“要寫(xiě)出什么”。錯(cuò)誤四只說(shuō)結(jié)果不說(shuō)明學(xué)習(xí)階段如果你是初學(xué)者可以直接告訴 AI我剛開(kāi)始學(xué)習(xí) JavaScript。 請(qǐng)避免使用我還沒(méi)有學(xué)過(guò)的高級(jí)語(yǔ)法。 如果必須使用請(qǐng)先解釋它的作用。AI 知道你的學(xué)習(xí)階段后可以調(diào)整解釋深度和代碼復(fù)雜度。九、提交需求前的快速檢查向 AI 發(fā)送需求前可以快速看一遍[ ] 我說(shuō)明了使用的語(yǔ)言、框架或運(yùn)行環(huán)境嗎 [ ] 我明確說(shuō)明了這次要完成什么嗎 [ ] 我說(shuō)明了哪些內(nèi)容暫時(shí)不做嗎 [ ] 我寫(xiě)清楚了輸入、輸出和關(guān)鍵規(guī)則嗎 [ ] 我告訴 AI 希望它如何回答嗎 [ ] 我要求它提供運(yùn)行或測(cè)試方法了嗎 [ ] 我是否刪除了密鑰、密碼和真實(shí)用戶數(shù)據(jù)如果暫時(shí)沒(méi)有足夠信息也可以這樣問(wèn)在開(kāi)始實(shí)現(xiàn)之前請(qǐng)先列出完成這個(gè)需求還需要我補(bǔ)充的關(guān)鍵信息。讓 AI 先提問(wèn)通常比讓它基于猜測(cè)直接寫(xiě)代碼更穩(wěn)妥。十、總結(jié)向 AI 描述編程需求不是把 Prompt 寫(xiě)得越長(zhǎng)越好而是把真正重要的信息說(shuō)清楚。今天重點(diǎn)學(xué)習(xí)了 4 個(gè)要素背景說(shuō)明技術(shù)棧、項(xiàng)目環(huán)境和當(dāng)前基礎(chǔ)。目標(biāo)明確這次要實(shí)現(xiàn)什么以及做到什么程度。限制說(shuō)明不能做什么、必須遵守哪些規(guī)則。輸出格式告訴 AI 希望它用什么方式回答、如何運(yùn)行和驗(yàn)證?？梢园阉鼈冇洺梢粡埡?jiǎn)單的卡片我現(xiàn)在在哪里 我想完成什么 有哪些事情不能做 我希望你怎樣交付請(qǐng)記住描述需求的過(guò)程本身也是梳理需求的過(guò)程。當(dāng)你能夠把一個(gè)問(wèn)題說(shuō)清楚通常也會(huì)更容易理解自己到底想解決什么。下一篇文章我們繼續(xù)練習(xí) 4 個(gè)新手可以直接套用的 AI 編程提示詞模板解釋代碼、生成函數(shù)、排查報(bào)錯(cuò)和優(yōu)化代碼。?堅(jiān)持原創(chuàng)求關(guān)注點(diǎn)贊收藏