ChatGPT 到底能不能真正帮忙写代码？【文尾附OpenAI注册方法】

现在竟然还有人怀疑 ChatGPT 能不能真正帮忙写代码，写的代码会不会 Bug 百出，网上就一张流传很广的搞笑图：

哈哈，这只是一个梗图，主要问题上面也说了「5分钟出代码」，如果无脑让 ChatGPT 帮忙写代码，自然效果不会太好，如果针对写代码时候碰到一些特定的问题，则绝对比搜索引擎好用，因为 ChatGPT 大语言模型更加理解程序员的需求，并且它还有上下文场景。文章源自IT老刘-https://wp.itlao6.com/11180.html

今天我碰到一个 jQuery 的问题，我想在 WordPress 的后台弹窗中显示编辑器，编辑器可以显示，但是编辑器的按钮只显示几个简单的：文章源自IT老刘-https://wp.itlao6.com/11180.html

我经过查看源代码，发现 WordPress 在渲染 TinyMCE 的按钮时候提供了 trigger，我可以在此做一些文章：文章源自IT老刘-https://wp.itlao6.com/11180.html

$( document ).trigger( 'wp-before-tinymce-init', init );
window.tinymce.init( init );

直接问 ChatGPT

作为 PHP 程序员，对 jQuery 不是那么熟悉，我就让 ChatGPT 帮我写这个功能了：文章源自IT老刘-https://wp.itlao6.com/11180.html

$( document ).trigger( 'wp-before-tinymce-init', init );
大哥，这里的 init 是对象，可以定义一个 callback 函数改变它的值吗？文章源自IT老刘-https://wp.itlao6.com/11180.html

下面是 ChatGPT 也很干脆，直接来：文章源自IT老刘-https://wp.itlao6.com/11180.html

是的，您可以在触发 wp-before-tinymce-init 事件之前，定义一个回调函数来修改 init 对象的值。下面是一个示例：文章源自IT老刘-https://wp.itlao6.com/11180.html

// 定义一个回调函数，用于修改 init 对象的值
function modifyInitObject(event, init) {
  // 检查 init 对象是否存在
  if (init) {
    // 修改 init 对象的某个属性或添加新属性
    init.yourProperty = 'yourValue';

    // 如果需要修改现有属性，请确保在修改前检查属性是否存在
    if (init.existingProperty) {
      init.existingProperty = 'new value';
    }
  }
}

// 在触发 'wp-before-tinymce-init' 事件之前，绑定回调函数
$(document).on('wp-before-tinymce-init', modifyInitObject);

// 触发 'wp-before-tinymce-init' 事件
$(document).trigger('wp-before-tinymce-init', init);

在这个示例中，我们首先定义了一个名为 modifyInitObject 的回调函数，该函数接受事件和 init 对象作为参数。在回调函数中，我们可以修改 init 对象的属性或添加新属性。然后，我们使用 $(document).on() 绑定回调函数，确保在触发 wp-before-tinymce-init 事件时调用该函数。最后，我们触发事件并传递 init 对象。文章源自IT老刘-https://wp.itlao6.com/11180.html

这样，当事件被触发时，回调函数将会修改 init 对象的值。文章源自IT老刘-https://wp.itlao6.com/11180.html

把代码发给 ChatGPT

我根据 ChatGPT 的答案，结合自己的业务写好了回调函数，但是发现并不生效，，懒得自己深究了，直接把代码发给 ChatGPT：文章源自IT老刘-https://wp.itlao6.com/11180.html

我这样写，貌似不生效，请问大哥有什么问题吗？文章源自IT老刘-https://wp.itlao6.com/11180.html

jQuery(function($){
	$(document).on('wp-before-tinymce-init', function(e, init){
		init = $.extend(init, <?php echo wpjam_json_encode($tinymce); ?>);
	});
});

ChatGPT 觉的是我 PHP 输出的不是 JavaScript 对象造成的问题：文章源自IT老刘-https://wp.itlao6.com/11180.html

根据您提供的代码，似乎您试图在回调函数中使用 $.extend() 来合并两个对象。您可能希望在 init 对象中添加 tinymce 对象中的属性和值。但是，代码中的问题是，您要合并的对象是直接从 PHP 输出的 JSON 对象，而不是 JavaScript 的对象。文章源自IT老刘-https://wp.itlao6.com/11180.html

为了解决此问题，您需要在输出 PHP JSON 对象之前，将其解码为 JavaScript 对象。这是一个修改后的例子：文章源自IT老刘-https://wp.itlao6.com/11180.html

$(document).on('wp-before-tinymce-init', function(e, init) {
  // 解码从 PHP 输出的 JSON 对象
  var tinymceObj = JSON.parse('<?php echo wpjam_json_encode($tinymce); ?>');

  // 使用 $.extend() 合并 init 和 tinymceObj 对象
  init = $.extend({}, init, tinymceObj);
});

在这个修改后的示例中，我们首先使用 JSON.parse() 将从 PHP 输出的 JSON 字符串解码为 JavaScript 对象。然后，我们使用 $.extend() 将 init 和 tinymceObj 对象合并。这样，init 对象应该包含 tinymce 对象中的属性和值。文章源自IT老刘-https://wp.itlao6.com/11180.html

请注意，这段代码需要在已经加载 jQuery 的环境中运行。如果您仍然遇到问题，请确保您的页面已经加载了 jQuery，并且没有其他 JavaScript 错误。文章源自IT老刘-https://wp.itlao6.com/11180.html

不生效提问 ChatGPT

我按照他的要求改了，但是还不生效，就继续问：文章源自IT老刘-https://wp.itlao6.com/11180.html

大哥，我修改之后还是不生效，可能是什么问题吗？文章源自IT老刘-https://wp.itlao6.com/11180.html

ChatGPT 给出了可能出现问题的地方，让我自己尝试去排除：文章源自IT老刘-https://wp.itlao6.com/11180.html

如果修改后的代码仍然不生效，那么可能存在其他问题。请尝试以下步骤来诊断和解决问题：文章源自IT老刘-https://wp.itlao6.com/11180.html

1. 确保 jQuery 已加载：请确保在执行此代码之前已经加载了 jQuery。您可以在浏览器的控制台输入 jQuery，如果返回一个函数，则说明 jQuery 已加载。

2. 检查其他 JavaScript 错误：在浏览器的控制台查看是否存在其他 JavaScript 错误。其他错误可能会影响您的代码的执行。

3. 确保 wp-before-tinymce-init 事件被触发：如果事件没有被触发，回调函数将不会执行。尝试在事件绑定之后立即触发事件，以确认代码正在执行：

如果您看到控制台输出，那么事件已成功触发并执行了回调函数。

$(document).on('wp-before-tinymce-init', function(e, init) {
  // ...您的代码...
});

// 触发事件以测试回调函数是否执行
$(document).trigger('wp-before-tinymce-init', init);

4. 检查 init 对象是否正确传递：确保传递给回调函数的 init 对象正确包含您期望的属性和值。在回调函数中输出 init 对象以进行检查。

5. 确保 PHP 变量 $tinymce 的值正确：在 PHP 代码中检查 $tinymce 变量的值，确保它包含正确的数据。如果可能，请将其值输出到控制台以进行检查。

6. 代码执行时机问题：确保在 wp-before-tinymce-init 事件触发之前绑定回调函数。如果在事件触发之后绑定回调函数，那么回调函数将不会执行。将代码放在 $(document).ready() 函数中，确保 DOM 完全加载后再执行代码：

$(document).on('wp-before-tinymce-init', function(e, init) {
  // ...您的代码...
});

// 触发事件以测试回调函数是否执行
$(document).trigger('wp-before-tinymce-init', init);

尝试以上步骤以诊断和解决问题。如果问题仍然存在，请提供更多关于问题的详细信息，以便我们能够更好地帮助您。

将上下文代码发给 ChatGPT

我认真看了 ChatGPT 的建议，感觉不是 PHP 输出 JavaScript 对象的问题，我觉得可能是我是 trigger 上下文代码给得太少了，它没理解，所以再把上下文代码发给 ChatGPT：

大哥，trigger 那边的代码是这样写的：

$( document ).trigger( 'wp-before-tinymce-init', init );
window.tinymce.init( init );

果然，这时候 ChatGPT 发现我的代码问题所在了：

了解了，这样的话，您需要确保您的代码在 $( document ).trigger( 'wp-before-tinymce-init', init ); 之前执行。

首先，您需要将您的回调函数绑定到 wp-before-tinymce-init 事件。然后，当 $( document ).trigger( 'wp-before-tinymce-init', init ); 代码执行时，您的回调函数将被调用，并且可以修改 init 对象。

此外，在您的回调函数中，您需要直接修改传入的 init 对象，而不是创建一个新的对象。这是因为 init 对象是通过引用传递的，所以您需要直接在原始对象上进行修改，以便在后续的 window.tinymce.init(init); 调用中使用修改后的值。

以下是修改后的代码示例：

// 将回调函数绑定到 'wp-before-tinymce-init' 事件
$(document).on('wp-before-tinymce-init', function(e, init) {
  // 解码从 PHP 输出的 JSON 对象
  var tinymceObj = JSON.parse('<?php echo wpjam_json_encode($tinymce); ?>');

  // 使用 $.extend() 合并 init 和 tinymceObj 对象
  $.extend(init, tinymceObj); // 注意：这里直接修改 init 对象，而不是创建一个新的对象
});

// 在这里触发 'wp-before-tinymce-init' 事件
$( document ).trigger( 'wp-before-tinymce-init', init );
window.tinymce.init( init );

请确保将此代码放在 $( document ).trigger( 'wp-before-tinymce-init', init ); 之前，以便在触发事件时正确调用回调函数。这样，回调函数将修改 init 对象，然后 window.tinymce.init(init); 调用将使用修改后的 init 对象。

总结

所以不要害怕，尝试去问 ChatGPT，它就会尝试给你答案，然后循序渐进缩小范围或者给出具体例子接着去提问，ChatGPT 会结合上下文就能帮你找到真正的问题所在，然后帮你解决。

如果通过搜索引擎，即使我写出了上面第二步的代码，也很难找到答案，因为搜索引擎是基于关键字的，这里首先我在不知道问题在哪里的时候就很难去定义正确的关键字，可能需要不停的重试，并且搜索引擎没有上下文，所以不管你尝试多少次，都不会对你下一次的搜索有帮助。😓 而 ChatGPT 就可以根据你的上下文定义出你的问题，给你精准的答案。

其实我这次问题其实是一个很小的问题，就是 $.extend() 返回的是一个新对象，对于我们这类 PHP 程序员可能要很久才能发现问题所在。那么如果我去搜索引擎搜索的话，因为我根本不知道问题在哪里，我都一开始可能都不知道搜索什么，可能尝试搜索 $.extend()，只有在有人和我发生过同样的问题，并且记录出来，我才会找到答案，这就是搜索引擎长尾关键字的痛苦，搜索的人首先要知道自己搜索什么，而很多人只是有问题，而且是无从下手的问题。

此外 ChatGPT 提供的代码都有相应的注释，非常利于理解，而且还提供了相关的解释，我好几次使用 ChatGPT 解决问题的时候，顺便还把自己知识的一些盲点都补全了，还修正了一些误区，比如以后我就知道 $.extend() 返回的是一个新对象，如果要修改的是参数，就不能用返回的对象了。

所以使用 ChatGPT 帮忙写一些功能非常明确的代码是非常好用的，针对迷惑的地方还可以进一步提问，顺便完善我们的编程知识和提供代码能力。😁