NotionNext BLOG

打造你自己的 ChatGPT：一份全面指南

Wed, 07 Feb 2024 00:00:00 GMT

学习如何在 OpenAI 的 ChatGPT 平台上轻松创建属于你的自定义 GPT，这里有一份详细的分步指南。让我们开始制作你独一无二的聊天助手吧！

OpenAI 最近推出了一个新功能，让每个人都能轻松打造专属的 GPT 模型。如今，你无需再为了定制化你的 ChatGPT 解决方案而与复杂的大语言模型（LLMs）或 Langchain 抗争。来认识一下 GPTs 吧！

如何创建自定义 GPT 的分步教程 - OpenAI

第一步：注册（账号设置）

首先，你需要订阅 ChatGPT Plus，月费 20 美元。这个订阅包含以下内容：

使用 GPT-4，目前最先进的模型

浏览、创建和运用 GPTs

使用 DALL·E、浏览器、高级数据分析等附加工具

你可以通过 chat.openai.com/ 进行注册和订阅。

了解更多关于 ChatGPT Plus 的信息。

第二步：创建新的自定义 GPT

在你的 chat.openai.com 控制面板上，点击“探索”按钮。

然后，点击“创建 GPT”按钮。

第三步：填写基础信息

接下来，系统会带你进入“GPT 构建器”界面，在这里你需要填写：

GPT 的功能（用一句话概括）

GPT 的名称（系统会提供建议）

一个头像（系统也会自动生成）

第四步：给出详细说明

在回答了一些关于这个工具的问题后，系统会引导你对这个 GPT 进行细致的调整。它会不断询问，直到收集到足够的信息来启动这个助手。

比如，如果我想创建一个帮助我改正语法的自定义 chatGPT，GPT 构建器会这样询问我：

第五步：在沙盒中尝试！

一旦有了足够的信息，你就可以在右侧的面板中试运行你的 GPT。

第六步：不断调优，直至达到完美！

你可以随时对 GPT 进行调整，使其更好地满足你的需求。在左侧面板与“构建器”进行对话，提出你的问题或指导。

打造你专属的自定义 GPT

除了聊天界面，你还可以通过直观的图形用户界面来配置各种功能。点击页面顶部的“配置”标签，你会发现有许多设置可以调整。

基本设置

在这里你可以修改：

头像

名字

描述

指南

记得，当你或其他人开始使用这个 GPT 时，头像、名字和描述会作为欢迎界面显示出来。

自定义 GPT 的进阶定制

自定义 GPT 能做的不止这些！在“配置”标签页向下滚动，你会看到更多选项：

会话开始器

会话开始器是聊天界面上方的按钮，可以作为执行特定任务的快捷方式。

知识库（文件上传）

你可以上传文件，比如 PDF，这些文件将作为 GPT 的额外知识资源。

GPT 的知识原本是有限的，仅包括它训练时的数据。现在，你可以通过上传 PDF 文件来丰富它的知识库。

功能（网页浏览、图像生成和代码解释）

你默认可以使用以下功能：

使用 Bing 浏览器进行网页浏览

使用 Dall-E 3 生成图像

读写代码

如果你不需要某些功能，也可以选择关闭它们。

动作

这是 GPT 中我最喜欢的一个功能。通过动作，你可以让 AI 调用外部 API！现在，你不仅可以使用市面上的 API，甚至还可以连接你自己创建的 API。

想了解更多关于 GPT 动作的信息，请访问：platform.openai.com/docs/action…。

点击“创建新动作”按钮，在这里你可以输入想要使用的 API 的 Open API 模式。

利用动作功能，OpenAI 现在为你的 API 提供 OpenAPI 规范的托管服务。这意味着你不必自己托管 OpenAPI 规范了。你可以导入现有的 OpenAPI 规范，或者利用 GPT 创建器的界面从零开始创建一个新的规范。

还有一个“认证”标签页，你可以在这里设置通过 API 密钥或 oAuth 来认证 API 的使用。

如需进一步了解如何将自定义 GPT 连接到互联网，请阅读这篇文章：如何将自定义 GPT 连接到互联网。

这个 GPT 不只是为个人使用而设计的！你可以通过分享链接或将其设为完全公开，来邀请其他人使用。

要做到这一点，点击右上角的保存按钮，然后设置可见性。

创建自定义 GPT 视频教程

这是一个视频教程，由 OpenAI 团队的 DevDay 提供，教你如何创建自己的自定义 ChatGPT。

常见问题解答

OpenAI 提供的自定义 GPT 需要多少费用？

你需要支付每月 20 美元的费用，因为使用它需要订阅 ChatGPT Plus。

如何编辑自定义 GPT？

点击探索菜单，然后在你想要编辑的自定义 GPT 上点击“编辑”。

如何删除自定义 GPT？

在探索菜单中，点击你想要删除的自定义 GPT 上的三个点，然后选择“删除 GPT”。

能否将 OpenAI 的自定义 GPT 连接到互联网？

可以，自定义 GPT 能够连接到互联网。默认情况下，它可以连接到 Bing 搜索引擎，或者你可以通过动作功能进行个性化定制。

如何将自定义 GPT 连接到 Google？

你可以通过动作功能使用外部 API 将自定义 ChatGPT 连接到 Google。例如，你可以使用 SerpApi 提供的 Google 搜索 API。

💡

有关Notion安装或者使用上的问题，欢迎您在底部评论区留言，一起交流~

Blog又双叒一次搬家了

Sat, 06 Jan 2024 00:00:00 GMT

😀

这已经不是第一次折腾Blog了，当然也不会是最后一次。

📝 为什换到NotionNext

在此之前用过wordpress、GitHub Page、Hexo Github，以及Evernot和有道云笔记，但用了Notion真的体验感直接拉满，真的一款好用的产品诠释了什么是不可回撤的效率，也是因为Notion才把个人博客再次折腾到NotionNext。

说说优点

直接和Notion集成，想到什么写什么，比起之前的，需要命令行在去写markdown，真的是编辑界面好多了。

内容直接在Notion中存储，省去一堆上传图片的烦恼，数据有保证。

真的很节省时间，Vercel直接部署也很快。

缺点也是有的

看了Issues 确实还有很多问题，间接导致系统不稳定，会频繁升级。

生态系统（皮肤、插件）还不够健全，希望可以参与到生态建设当中。

🎉 最后

最后还是要庆祝一下这次的”搬家“，坚持码字，快乐生活。

搞懂防抖、节流及应用场景

Sun, 28 Aug 2022 00:00:00 GMT

😀

防抖和节流你是否有时候傻傻分不清楚的时候？教你一个技巧绝对不会再弄混。

先来认识一下这两个基础的概念，防抖和节流是前端开发中常用的函数优化手段，它们可以限制函数的执行频率，提升性能和用户体验。在我们的日常开发中，经常会遇到一些需要对函数进行优化的场景，比如防止表单的重复提交。

防抖(debounce)

事件被触发n秒后再执行回调，如果在这n秒内又被触发，则重新计时。

防抖，顾名思义，防止抖动，什么叫抖动，事件被高频触发，想象你在用鼠标点击按钮操纵一个小人让他有跳跃的动作，你狂点鼠标，小人狂跳，这就是最直观的抖动现象。

直接上代码

节流(throttle)

规定在一个单位时间内，只能触发一次函数。如果这个单位时间内触发多次函数，只有一次生效。

简单的可以理解为指定时间间隔只执行一次任务。

直接看代码：

注：节流函数并不止上面这种实现方案,例如可以完全不借助setTimeout，可以把状态位换成时间戳，然后利用时间戳差值是否大于指定间隔时间来做判定。也可以直接将setTimeout的返回的标记当做判断条件-判断当前定时器是否存在，如果存在表示还在冷却，并且在执行fn之后消除定时器表示激活，原理都一样。

防抖与节流的区别

上面已经介绍过两者的定义，我们在看下两者的区别，及如何来永远记住他们

防抖：它限制函数在一段连续的时间内只执行一次。当连续触发某个事件时，只有在事件停止触发一段时间后，才会执行函数。

节流：它按照固定的时间间隔执行函数。当连续触发某个事件时，每隔一段时间执行一次函数。

简而言之，防抖是在事件停止触发后延迟执行函数，而节流是按照固定的时间间隔执行函数。

王者荣耀大家都玩过吧，里面的英雄都有一个攻击间隔，当我们连续的点击普通攻击的时候，英雄的攻速并不会随着我们点击的越快而更快的攻击。这个其实就是节流，英雄会按照自身攻速的系数执行攻击，我们点的再快也没用。

而防抖在王者荣耀中就是回城，在游戏中经常会遇到连续回城嘲讽对手的玩家，它们每点击一次回城，后一次的回城都会打断前一次的回城，只有最后一次点击的回城会被触发，从而保证回城只执行一次，这就是防抖的概念。

应用场景

防抖：

search搜索联想，用户在不断输入值时，用防抖来节约请求资源。 window触发resize的时候，不断的调整浏览器窗口大小会不断的触发这个事件，用防抖来让其只触发一次

节流：

鼠标不断点击触发，mousedown(单位时间内只触发一次) 监听滚动事件，比如是否滑到底部自动加载更多，用throttle来判断

💡

有关Notion安装或者使用上的问题，欢迎您在底部评论区留言，一起交流~

栈内存堆内存和预处理

Fri, 02 Jul 2021 00:00:00 GMT

浏览器是如何运行javascript代码的？JavaScript 是如何运行的？

看例1：

用图解释这一行代码是如何执行的。

这是一个简单的图示，现在我们来增加几个概念：栈内存、堆内存和预处理。

栈内存

栈内存用来存放基本数据类型(Number、String、Boolean、Null和Undefined)，在执行完之后销毁。

栈内存与另一个概念息息相关——作用域，即代码的执行环境。上图中左边的栈内存就是全局作用域，而右边的则是局部作用域。全局作用域在浏览器窗口关闭之后才销毁。局部作用域在执行完之后就会销毁。

javascript规定，父作用域不能使用子作用域中变量和方程，而反过来是可以的。这个反过来的方向链条则被称为作用域链。

这里需要注意的是，判断子作用域的父作用域是哪一个，要看这个子作用域是在哪里定义的，而不是在哪里执行。

堆内存

堆内存用来存放引用数据类型(object、array、function、date)，在没有被引用之后销毁。

当我们声明和定义了一个引用数据类型之后，这个对象保存在堆内存中，而这个对象的地址则保存在栈内存中以用于引用。

在全局作用域声明和定义的引用数据类型，销毁的方法是手动赋值null。

看一组例子来说明栈内存与堆内存的区别：

例2

例3

例2的图解

例3的图解

由上两个图解可见，当基本数据类型传递的时候，其实是复制了一个新的数据给另一个变量；而当引用类型传递的时候，复制的仅仅是引用数据类型的地址，两个变量通过地址指向的是同一个堆内存中的数据。

所以在例3中，当我们改变n.a的时候，m.a也同样改变了。

预处理

预处理是浏览器在执行代码前要做的任务，它包括变量的声明和函数声明与定义。

预处理是变量提升的原因。

当我们写了var num = 12这样的一行代码的时候，在执行时其实是分为两步：声明var num和定义num = 12。对于变量，预处理只做声明而不做定义。

而相对于函数function fn(){var num 12}，同样有声明和定义之分，与变量不同的是，预处理时声明和定义全部执行。具体步骤是：声明function fn()，定义fn() = "{var num = 12}"。

理解了栈内存、堆内存和预处理之后，重新画出例1的图示：

这里的堆内存xxxfff000被全局作用域的函数fn引用，而全局作用域只有在浏览器窗口关闭的时候才会销毁，所以，只要浏览器窗口没有关闭，则堆内存xxxfff000一直被引用而不会销毁。

参考资料：

javascript高级程序设计(第三版)；

💡

有关Notion安装或者使用上的问题，欢迎您在底部评论区留言，一起交流~

闭包为什么会占用内存

Fri, 02 Jul 2021 00:00:00 GMT

在试图弄清这个问题之前，先要理解栈内存堆内存和预处理

占用内存，不会销毁的闭包实例

例1：

例1的图示

未被占用的堆内存才会被销毁

所以，正如图中椭圆形关键点中说明的那样，堆内存xxxfff111被返回给了全局变量f，而全局变量只有在窗口关闭的时候才会销毁，因此堆内存xxxfff111将一直被占用而不会销毁，定义它的局部作用域A也不会被销毁。

例2

这段代码的特点是：私有作用域给dom元素的事件绑定一个方法。

例2的图示：

正如图中椭圆形关键点所说，标签对象的属性里面会自带一个onclick的属性，未被赋值时其值为null。那么，在自执行函数执行的时候，其创建的作用域所占用的堆内存xxxfff111同样也会被全局的堆内存xxxfff000占用（这里要注意，是堆内存占用堆内存），所以堆内存xxxfff111和栈内存A都不会被销毁。

不占用内存，立即销毁的实例

只需要将例1稍作修改。

例3：

例3的图示

由于在函数fn中，xxxfff111是被return的，所以栈内存A的预解释不会处理xxxfff111，它只在fn函数执行的时候才会生成，而函数fn的栈内存A每次被执行之后都会被销毁。

暂时占用内存，延时销毁的闭包实例

将例3稍作修改，就变成了延时销毁的闭包实例。

例4：

例4的图示：

正如途中椭圆形关键点处所说，fn()()的意思是在执行完fn()之后再把返回的值函数执行一遍。因此在子函数执行的时候，堆内存xxxfff111被占用了，相应的栈内存A也将保留。

可堆内存xxxfff111中保存的子函数在执行完成之后还是会被销毁，接着堆内存xxxfff111就作为未被占用的堆内存而被销毁，最终栈内存A也会被销毁。

所以，栈内存在执行完之后会被保留一段时间，这段时间等于其子函数执行的时间。

参考资料：

javascript高级程序设计(第三版)。

💡

有关Notion安装或者使用上的问题，欢迎您在底部评论区留言，一起交流~

JS 中的事件绑定、事件监听、事件委托

Fri, 02 Jul 2021 00:00:00 GMT

事件绑定

要想让 javascript 对用户的操作作出响应，首先要对 dom 元素绑定事件处理函数。所谓事件处理函数，就是处理用户操作的函数，不同的操作对应不同的名称

在javascript中，有三种常用的绑定事件的方法

在dom元素中直接绑定；
在javascript代码中绑定；
绑定事件监听函数

在`dom`中直接绑定事件

在`javascript`代码中绑定事件

在javascript代码中（即script标签内）绑定事件可以使javascript代码与HTML标签分离，文档结构清晰，便于管理和开发

使用事件监听绑定事件

关于事件监听，W3C规范中定义了3个事件阶段，依次是捕获阶段、目标阶段、冒泡阶段

起初Netscape制定了javascript的一套事件驱动机制（即事件捕获）。随即IE也推出了自己的一套事件驱动机制（即事件冒泡）。最后W3C规范了两种事件机制，分为捕获阶段、目标阶段、冒泡阶段。IE8以前IE一直坚持自己的事件机制（前端人员一直头痛的兼容性问题），IE9以后IE也支持了W3C规范

W3C规范

语法

event : （必需）事件名，支持所有dom事件。

function：（必需）指定要事件触发时执行的函数。

useCapture：（可选）指定事件是否在捕获或冒泡阶段执行。true，捕获。false，冒泡。默认false

注： IE8 以下不支持

IE标准

语法：

event：（必需）事件类型。需加“on“，例如：onclick。

function：（必需）指定要事件触发时执行的函数

事件监听的优点

可以绑定多个事件

常规的事件绑定只执行最后绑定的事件

两个事件都执行了

可以解除相应的绑定

封装事件监听

事件委托

事件委托就是利用冒泡的原理，把事件加到父元素或祖先元素上，触发执行效果

事件委托优点

提高javascript性能。事件委托可以显著的提高事件的处理速度，减少内存的占用

传统写法

事件委托

动态的添加dom元素，不需要因为元素的改动而修改事件绑定

传统写法

点击item1到item3都有事件响应，但是点击item4时，没有事件响应。说明传统的事件绑定无法对动态添加的元素而动态的添加事件。

事件委托

当点击item4时，item4有事件响应。说明事件委托可以为新添加的dom元素动态的添加事件

💡

有关Notion安装或者使用上的问题，欢迎您在底部评论区留言，一起交流~

NotionNext BLOG

打造你自己的 ChatGPT：一份全面指南

如何创建自定义 GPT 的分步教程 - OpenAI

打造你专属的自定义 GPT

自定义 GPT 的进阶定制

创建自定义 GPT 视频教程

常见问题解答

Blog又双叒一次搬家了

📝 为什换到NotionNext

说说优点

缺点也是有的

🎉 最后

搞懂防抖、节流及应用场景

防抖(debounce)

节流(throttle)

防抖与节流的区别

应用场景

栈内存堆内存和预处理

栈内存

堆内存

看一组例子来说明栈内存与堆内存的区别：

预处理

闭包为什么会占用内存

占用内存，不会销毁的闭包实例

例1：

例2

不占用内存，立即销毁的实例

例3：

暂时占用内存，延时销毁的闭包实例

例4：

JS 中的事件绑定、事件监听、事件委托

事件绑定

在dom中直接绑定事件

在javascript代码中绑定事件

使用事件监听绑定事件

事件监听的优点

事件委托

事件委托优点

在`dom`中直接绑定事件

在`javascript`代码中绑定事件