本文介绍了如何使用LangChain.js框架构建Tool-Calling Agent一种能够自主判断是否使用工具、选择哪个工具以及如何使用的AI智能体。文章从Agent与普通LLM调用的区别讲起详细阐述了Agent的工作原理和ReAct模式。推荐LangChain.js因其TypeScript原生支持、模型无关性、工具定义标准化等优势。通过实例代码展示了如何从零搭建一个能查天气、做计算的Agent并探讨了如何让Agent具备记忆功能。最后文章总结了写好工具的四个原则并与Vercel AI SDK进行了对比提供了实用的避坑指南。Tool-Calling Agent 全景图先搞懂一个概念Agent 到底是啥在 AI 领域“Agent” 这个词已经被说烂了。但很多人其实搞不清楚 Agent 和普通的 LLM 调用有什么区别。「普通 LLM 调用」你问一句它答一句。就像查字典——你翻到哪页它就给你看那页的内容。「Agent」你给它一个目标它自己想办法完成。它会思考要不要用工具→ 用了之后看看结果 → 再决定下一步做什么 → 直到任务完成。用一句话总结区别「普通调用是一问一答Agent 是给个目标自己搞定。」比如你问普通 LLM“北京今天天气怎么样”——它只能根据训练数据编一个答案大概率不准。但你问一个 Tool-Calling Agent 同样的问题它的思考过程是这样的1. 思考用户问天气我需要查实时数据我有一个天气工具可以用2. 行动调用天气工具参数{city:北京}3. 观察工具返回了晴25°C湿度 40%4. 思考信息够了可以回答用户了5. 最终回答北京今天天气晴朗气温25°C湿度40%适合出门~这个思考 → 行动 → 观察的循环就是经典的「ReAct 模式」Reasoning Acting。Agent 的工作循环为什么用 LangChain.js做 Agent 的框架很多为什么推荐前端同学从 LangChain.js 入手「原生 TypeScript」——类型安全前端写着顺手「模型无关」——同一套代码可以切换 OpenAI、Anthropic、Ollama 等不同模型「工具定义标准化」——用 Zod 定义参数 schema跟我们写接口校验一模一样「生态完善」——从最简单的 Tool-Calling Agent 到 LangGraph 的多 Agent 编排一条路走到底「社区活跃」——GitHub 上 langchainjs 有 13k Star文档持续更新当然Vercel AI SDK 也很好用特别是做 UI 层面的流式渲染后面我们会拿它做对比。但如果你想理解 Agent 的底层原理LangChain.js 讲得更透。动手从零搭一个能查天气的 Agent不多废话了直接上代码。我们的目标是做一个**「能查天气、能做数学计算」**的 Agent。第一步初始化项目mkdirmy-first-agentamp;amp;cdmy-first-agentnpminit-ynpminstalllangchain langchain/openai langchain/core zod如果你用其他模型比如 Anthropic Claude装对应的包就行npminstalllangchain/anthropic# 用 Claudenpminstalllangchain/ollama# 用本地 Ollama第二步定义工具工具是 Agent 的手脚。每个工具就是一个函数但你需要告诉 LLM 三件事一个 Tool 的三要素「name」工具叫什么LLM 通过名字来调用它「description」什么时候该用这个工具LLM 靠这个判断要不要调用「schema」调用时需要传什么参数用 Zod 定义LLM 会按这个格式传参来写两个工具——一个查天气一个做计算import{tool}fromlangchain/core/tools;import{z}fromzod;// 工具一查天气 const weatherTooltool(async({city})gt;{// 实际项目中这里调真实的天气 API // 这里用模拟数据演示 constmockWeather: Recordlt;string, stringgt;{北京:晴25°C湿度 40%,上海:多云28°C湿度 65%,深圳:阵雨30°C湿度 80%,};returnmockWeather[city]||抱歉暂不支持查询 ${city}的天气;},{name:get_weather, description:查询指定城市的当前天气。当用户询问天气相关问题时使用。, schema: z.object({city: z.string().describe(要查询天气的城市名称),}),});// 工具二数学计算 const calculatorTooltool(async({expression})gt;{try{// 注意生产环境不要用 eval这里仅做演示 const resultFunction(use strict;return(${expression}))();return${expression}${result};}catch{return无法计算表达式${expression};}},{name:calculator, description:执行数学计算。当用户需要做加减乘除、百分比等数学运算时使用。, schema: z.object({expression: z.string().describe(要计算的数学表达式如 2 3 * 4),}),});「重点关注description的写法」——它不是给人看的注释而是 LLM 判断要不要调用这个工具的依据。写清楚什么场景下用Agent 的准确率会高很多。第三步创建 Agent工具定义好了接下来把它们组装成一个 Agentimport{ChatOpenAI}fromlangchain/openai;import{ChatPromptTemplate, MessagesPlaceholder}fromlangchain/core/prompts;import{AgentExecutor, createToolCallingAgent}fromlangchain/agents;//1. 初始化 LLM const llmnewChatOpenAI({modelName:gpt-4o, temperature:0, // Agent 场景建议 temperature 设低减少随机性});//2. 定义 Prompt 模板 const promptChatPromptTemplate.fromMessages([[system,你是一个实用的助手可以帮用户查天气和做数学计算。请用中文回答。], newMessagesPlaceholder(chat_history),[human,{input}], newMessagesPlaceholder(agent_scratchpad),]);//3. 把工具、LLM、Prompt 组装成 Agent const tools[weatherTool, calculatorTool];const agentcreateToolCallingAgent({llm, tools, prompt});//4. 创建 AgentExecutor负责执行 Agent 的循环 const executornewAgentExecutor({agent, tools, verbose: true, // 开启后可以看到 Agent 的思考过程});这里解释一下几个关键角色角色干什么的llm大脑负责思考和决策tools手脚负责执行具体操作prompt人设告诉 Agent 它是谁、怎么行为agent把以上三者组装在一起的策略层executor执行引擎驱动 Agent 的思考→行动→观察循环第四步跑起来试试// 单轮对话 const resultawait executor.invoke({input:北京今天天气怎么样, chat_history:[],});console.log(result.output);// →北京今天天气晴朗气温25°C湿度40%。// 多步推理 const result2await executor.invoke({input:北京和上海今天温差多少度, chat_history:[],});console.log(result2.output);// Agent 会 //1. 调用 get_weather({city:北京})→25°C //2. 调用 get_weather({city:上海})→28°C //3. 调用 calculator({expression:28 - 25})→3//4. 回答上海比北京高3°C第二个例子特别有意思——Agent「自己判断需要调用三次工具」查两个城市天气 计算温差然后把结果组合成最终回答。这就是 Agent 的价值你不需要告诉它先查 A 再查 B 再算差值它自己会规划。prompt 里的 agent_scratchpad 是什么你可能注意到 Prompt 模板里有个agent_scratchpad。这个东西很关键但很多教程不解释。「agent_scratchpad就是 Agent 的草稿纸。」Agent 每次调用工具后工具的调用记录和返回结果都会追加到agent_scratchpad里。下一轮思考时LLM 就能看到我之前做了什么、得到了什么结果从而决定下一步怎么办。拿查北京和上海温差这个例子来说agent_scratchpad 的内容大概是这样演变的「第一轮调用天气工具查北京」[AI 调用了 get_weather参数{city:北京}][工具返回晴25°C湿度40%]「第二轮继续查上海」[AI 调用了 get_weather参数{city:北京}][工具返回晴25°C湿度40%][AI 调用了 get_weather参数{city:上海}][工具返回多云28°C湿度65%]「第三轮计算温差」[前面的记录...][AI 调用了 calculator参数{expression:28 - 25}][工具返回28 -253]LLM 看到这些记录后觉得信息够了就不再调用工具直接输出最终回答。加上对话记忆让 Agent 记住上下文上面的例子每次调用都是独立的Agent 不记得之前聊过什么。要加记忆很简单——把历史消息传进chat_history就行import{HumanMessage, AIMessage}fromlangchain/core/messages;// 维护一个对话历史数组 constchatHistory:(HumanMessage|AIMessage)[][];asyncfunctionchat(userInput: string){const resultawait executor.invoke({input: userInput, chat_history: chatHistory,});// 把这轮对话追加到历史 chatHistory.push(newHumanMessage(userInput));chatHistory.push(newAIMessage(result.output));returnresult.output;}// 试试看 awaitchat(我在北京);// →好的你在北京。awaitchat(这里天气怎么样);// → Agent 会记得你说了在北京直接查北京天气这里要注意chat_history越长每次发给 LLM 的 token 越多。实际项目中需要做截断或者摘要别让历史记录无限增长。写好工具的 4 个原则工具的质量直接决定 Agent 好不好用。根据我自己的实践总结 4 个原则原则一description 是灵魂LLM 完全靠 description 来决定用不用这个工具。写不好 Agent 不会用 等于没有。// ❌ 太模糊LLM 不知道什么时候该用 description:一个有用的工具// ❌ 太技术化LLM 可能理解偏 description:Calls the OpenWeatherMap REST API v3 endpoint// ✅ 既说了干什么又说了什么时候用 description:查询指定城市的当前天气信息温度、湿度、天气状况。当用户询问某个城市的天气、温度、是否需要带伞等问题时使用。原则二schema 定义要精确每个参数都加.describe()告诉 LLM 这个参数是什么意思、应该传什么值。schema: z.object({city: z.string().describe(城市名称如北京、上海、London), unit: z.enum([celsius,fahrenheit]).describe(温度单位).default(celsius),})原则三工具函数要健壮工具内部一定要做好错误处理返回清晰的错误信息而不是直接抛异常。因为 Agent 会拿工具的返回值来看结果如果返回的是一堆 stack trace它大概率会困惑。// ✅ 返回清晰的错误信息Agent 能理解并调整策略 const resultawaitfetchWeather(city);if(!result){return未能查询到 ${city}的天气请检查城市名称是否正确;}原则四一个工具只做一件事不要搞一个万能工具——查天气、算数、搜索全塞在一个工具里。「拆开写每个工具职责单一。」LLM 判断用哪个的准确率会高很多。实战进阶接入真实 API前面用的是模拟数据实际项目中你需要接真实的 API。这里用 fetch 调接口的方式写一个真实可用的天气工具const realWeatherTooltool(async({city})gt;{constAPI_KEYprocess.env.WEATHER_API_KEY;const urlhttps://api.openweathermap.org/data/2.5/weather?q${city}amp;appid${API_KEY}amp;unitsmetricamp;langzh_cn;try{const resawaitfetch(url);if(!res.ok)return查询失败HTTP 状态码${res.status};const dataawait res.json();return${city}${data.weather[0].description}温度 ${data.main.temp}°C湿度 ${data.main.humidity}%风速 ${data.wind.speed}m/s;}catch(error){return查询天气时出错${(error asError).message};}},{name:get_weather, description:查询指定城市的实时天气。当用户询问天气、温度、是否下雨等问题时使用。, schema: z.object({city: z.string().describe(城市名称支持中文和英文),}),});套路就是这样「工具函数里放你平时在前端项目里写的 fetch 逻辑就行」。Agent 负责什么时候调、传什么参数你负责调了之后怎么处理。和 Vercel AI SDK 的区别做 AI 产品时LangChain.js 和 Vercel AI SDK 经常被拿来对比。它们不是竞争关系而是侧重点不同维度LangChain.jsVercel AI SDK定位Agent 框架侧重逻辑编排UI 框架侧重前端交互核心能力Tool Calling、Chain、Memory、RAGuseChat、useCompletion、流式渲染适合场景复杂 Agent 逻辑、多工具编排、多步推理聊天界面、流式 UI、简单工具调用学习曲线概念多上手稍慢API 简洁上手快进阶路线→ LangGraph多 Agent 编排→ Server Actions RSC「我的建议」如果你只是做一个带工具调用的聊天界面「Vercel AI SDK 更轻量」如果你要做复杂的 Agent 逻辑多工具编排、多步推理、状态管理「LangChain.js 更合适」两者也可以组合用LangChain.js 管逻辑层Vercel AI SDK 管 UI 层避坑指南1. temperature 设低一点Agent 场景下 LLM 需要理性决策而不是创意发挥。把 temperature 设成 0 或 0.1Agent 的工具调用准确率会高很多。2. 不要给太多工具工具越多LLM 选择的难度越大。实际测试下来**「5~8 个工具」**是一个比较舒适的范围。超过 10 个LLM 就容易选错。如果你确实有很多工具可以考虑工具路由——先让一个 Agent 判断属于哪个分类再把任务转给对应分类下的子 Agent。3. verbose 开发时打开上线时关掉verbose: true能让你看到 Agent 的完整思考过程它在想什么、调了什么工具、得到了什么结果调试时非常有用。但上线时记得关掉否则会有性能开销和信息泄露风险。4. 工具超时要兜底如果你的工具调用了外部 API一定要设超时。不然 API 挂了整个 Agent 就卡死了。const controllernewAbortController();consttimeoutsetTimeout(()gt;controller.abort(),5000);try{const resawaitfetch(url,{signal: controller.signal});//...}catch(error){if((error asError).nameAbortError){return查询超时请稍后再试;}throw error;}finally{clearTimeout(timeout);}5. 警惕无限循环Agent 的 “思考→行动→观察” 循环理论上可以无限走下去。如果工具一直返回不符合预期的结果Agent 可能会反复调用同一个工具。AgentExecutor有一个maxIterations参数来防止这种情况const executornewAgentExecutor({agent, tools, maxIterations:5, // 最多循环5次超过直接返回});完整代码汇总把上面的代码整理成一个完整的可运行文件// agent.tsimport{ChatOpenAI}fromlangchain/openai;import{ChatPromptTemplate, MessagesPlaceholder}fromlangchain/core/prompts;import{AgentExecutor, createToolCallingAgent}fromlangchain/agents;import{HumanMessage, AIMessage}fromlangchain/core/messages;import{tool}fromlangchain/core/tools;import{z}fromzod;// --- 定义工具 --- const weatherTooltool(async({city})gt;{constmockWeather: Recordlt;string, stringgt;{北京:晴25°C湿度 40%,上海:多云28°C湿度 65%,深圳:阵雨30°C湿度 80%,};returnmockWeather[city]||暂不支持查询 ${city}的天气;},{name:get_weather, description:查询指定城市的当前天气。当用户询问天气相关问题时使用。, schema: z.object({city: z.string().describe(要查询天气的城市名称),}),});const calculatorTooltool(async({expression})gt;{try{const resultFunction(use strict;return(${expression}))();return${expression}${result};}catch{return无法计算${expression};}},{name:calculator, description:执行数学运算。当用户需要做加减乘除等计算时使用。, schema: z.object({expression: z.string().describe(数学表达式如 2 3 * 4),}),});// --- 创建 Agent --- const llmnewChatOpenAI({modelName:gpt-4o, temperature:0});const tools[weatherTool, calculatorTool];const promptChatPromptTemplate.fromMessages([[system,你是一个实用的助手可以查天气和做计算。请用中文回答。], newMessagesPlaceholder(chat_history),[human,{input}], newMessagesPlaceholder(agent_scratchpad),]);const agentcreateToolCallingAgent({llm, tools, prompt});const executornewAgentExecutor({agent, tools, maxIterations:5});// --- 带记忆的对话 --- constchatHistory:(HumanMessage|AIMessage)[][];asyncfunctionchat(userInput: string){const resultawait executor.invoke({input: userInput, chat_history: chatHistory,});chatHistory.push(newHumanMessage(userInput));chatHistory.push(newAIMessage(result.output));console.log(用户${userInput});console.log(助手${result.output}\n);returnresult.output;}// --- 运行 --- awaitchat(北京和上海今天温差多少度);awaitchat(那深圳呢比北京热多少);总结Tool-Calling Agent 的核心就三件事「定义工具」——告诉 LLM 有哪些工具可用、什么时候用、怎么传参「组装 Agent」——把 LLM 工具 Prompt 组装起来「让 Agent 自己跑」——它会自动决定用不用工具、用哪个、用几次LangChain.js 把这三步封装得非常简洁。你会发现「难的不是写代码而是写好工具的 description 和 schema」——这决定了 Agent 能不能在正确的时机调用正确的工具。如果你跟着这篇文章跑通了第一个 Agent下一步可以试试加更多工具搜索、数据库查询、发邮件……接入真实 API 替换模拟数据用 LangGraph 做更复杂的多步工作流如何学习大模型 AI 由于新岗位的生产效率要优于被取代岗位的生产效率所以实际上整个社会的生产效率是提升的。但是具体到个人只能说是“最先掌握AI的人将会比较晚掌握AI的人有竞争优势”。这句话放在计算机、互联网、移动互联网的开局时期都是一样的道理。我在一线互联网企业工作十余年里指导过不少同行后辈。帮助很多人得到了学习和成长。我意识到有很多经验和知识值得分享给大家也可以通过我们的能力和经验解答大家在人工智能学习中的很多困惑所以在工作繁忙的情况下还是坚持各种整理和分享。但苦于知识传播途径有限很多互联网行业朋友无法获得正确的资料得到学习提升故此将并将重要的AI大模型资料包括AI大模型入门学习思维导图、精品AI大模型学习书籍手册、视频教程、实战学习等录播视频免费分享出来。这份完整版的大模型 AI 学习资料已经上传CSDN朋友们如果需要可以微信扫描下方CSDN官方认证二维码免费领取【保证100%免费】为什么要学习大模型我国在A大模型领域面临人才短缺,数量与质量均落后于发达国家。2023年人才缺口已超百万凸显培养不足。随着AI技术飞速发展预计到2025年,这一缺口将急剧扩大至400万,严重制约我国AI产业的创新步伐。加强人才培养,优化教育体系,国际合作并进是破解困局、推动AI发展的关键。大模型入门到实战全套学习大礼包1、大模型系统化学习路线作为学习AI大模型技术的新手方向至关重要。 正确的学习路线可以为你节省时间少走弯路方向不对努力白费。这里我给大家准备了一份最科学最系统的学习成长路线图和学习规划带你从零基础入门到精通2、大模型学习书籍文档学习AI大模型离不开书籍文档我精选了一系列大模型技术的书籍和学习文档电子版它们由领域内的顶尖专家撰写内容全面、深入、详尽为你学习大模型提供坚实的理论基础。3、AI大模型最新行业报告2025最新行业报告针对不同行业的现状、趋势、问题、机会等进行系统地调研和评估以了解哪些行业更适合引入大模型的技术和应用以及在哪些方面可以发挥大模型的优势。4、大模型项目实战配套源码学以致用在项目实战中检验和巩固你所学到的知识同时为你找工作就业和职业发展打下坚实的基础。5、大模型大厂面试真题面试不仅是技术的较量更需要充分的准备。在你已经掌握了大模型技术之后就需要开始准备面试我精心整理了一份大模型面试题库涵盖当前面试中可能遇到的各种技术问题让你在面试中游刃有余。适用人群第一阶段10天初阶应用该阶段让大家对大模型 AI有一个最前沿的认识对大模型 AI 的理解超过 95% 的人可以在相关讨论时发表高级、不跟风、又接地气的见解别人只会和 AI 聊天而你能调教 AI并能用代码将大模型和业务衔接。大模型 AI 能干什么大模型是怎样获得「智能」的用好 AI 的核心心法大模型应用业务架构大模型应用技术架构代码示例向 GPT-3.5 灌入新知识提示工程的意义和核心思想Prompt 典型构成指令调优方法论思维链和思维树Prompt 攻击和防范…第二阶段30天高阶应用该阶段我们正式进入大模型 AI 进阶实战学习学会构造私有知识库扩展 AI 的能力。快速开发一个完整的基于 agent 对话机器人。掌握功能最强的大模型开发框架抓住最新的技术进展适合 Python 和 JavaScript 程序员。为什么要做 RAG搭建一个简单的 ChatPDF检索的基础概念什么是向量表示Embeddings向量数据库与向量检索基于向量检索的 RAG搭建 RAG 系统的扩展知识混合检索与 RAG-Fusion 简介向量模型本地部署…第三阶段30天模型训练恭喜你如果学到这里你基本可以找到一份大模型 AI相关的工作自己也能训练 GPT 了通过微调训练自己的垂直大模型能独立训练开源多模态大模型掌握更多技术方案。到此为止大概2个月的时间。你已经成为了一名“AI小子”。那么你还想往下探索吗为什么要做 RAG什么是模型什么是模型训练求解器 损失函数简介小实验2手写一个简单的神经网络并训练它什么是训练/预训练/微调/轻量化微调Transformer结构简介轻量化微调实验数据集的构建…第四阶段20天商业闭环对全球大模型从性能、吞吐量、成本等方面有一定的认知可以在云端和本地等多种环境下部署大模型找到适合自己的项目/创业方向做一名被 AI 武装的产品经理。硬件选型带你了解全球大模型使用国产大模型服务搭建 OpenAI 代理热身基于阿里云 PAI 部署 Stable Diffusion在本地计算机运行大模型大模型的私有化部署基于 vLLM 部署大模型案例如何优雅地在阿里云私有部署开源大模型部署一套开源 LLM 项目内容安全互联网信息服务算法备案…学习是一个过程只要学习就会有挑战。天道酬勤你越努力就会成为越优秀的自己。如果你能在15天内完成所有的任务那你堪称天才。然而如果你能完成 60-70% 的内容你就已经开始具备成为一名大模型 AI 的正确特征了。这份完整版的大模型 AI 学习资料已经上传CSDN朋友们如果需要可以微信扫描下方CSDN官方认证二维码免费领取【保证100%免费】