JavaScript

虽然大部分 Django 核心是 Python，但 admin 和 gis 贡献应用程序包含 JavaScript 代码。

在编写 JavaScript 代码以包含在 Django 中时，请遵循这些编码标准。

代码风格

请遵循 .editorconfig 文件中规定的缩进样式。我们建议使用支持 [X38X]EditorConfig 的文本编辑器以避免缩进和空格问题。大多数 JavaScript 文件使用 4 个空格作为缩进，但也有一些例外。
命名变量时，使用 camelCase 而不是 underscore_case。不同的 JavaScript 文件有时使用不同的代码风格。请尽量符合每个文件的代码风格。
使用 ESLint 代码 linter 检查您的代码是否存在错误和样式错误。当您运行 JavaScript 测试时，将运行 ESLint。我们还建议在您的文本编辑器中安装 ESLint 插件。
在可能的情况下，编写即使稍后使用 JavaScript 更改页面结构也能正常工作的代码。例如，在绑定点击处理程序时，使用 $('body').on('click', selector, func) 而不是 $(selector).click(func)。这使得项目可以更轻松地使用 JavaScript 扩展 Django 的默认行为。

JavaScript 补丁

Django 的管理系统利用 jQuery 框架来增加管理界面的功能。结合起来，重点放在管理 JavaScript 性能和最小化整体管理媒体文件大小。

JavaScript 测试

Django 的 JavaScript 测试可以在浏览器或命令行中运行。测试位于顶级 js_tests 目录中。

编写测试

Django 的 JavaScript 测试使用 QUnit。这是一个示例测试模块：

QUnit.module('magicTricks', {
    beforeEach: function() {
        const $ = django.jQuery;
        $('#qunit-fixture').append('<button class="button"></button>');
    }
});

QUnit.test('removeOnClick removes button on click', function(assert) {
    const $ = django.jQuery;
    removeOnClick('.button');
    assert.equal($('.button').length, 1);
    $('.button').click();
    assert.equal($('.button').length, 0);
});

QUnit.test('copyOnClick adds button on click', function(assert) {
    const $ = django.jQuery;
    copyOnClick('.button');
    assert.equal($('.button').length, 1);
    $('.button').click();
    assert.equal($('.button').length, 2);
});

有关 QUnit 支持的断言类型的信息，请参阅 QUnit 文档。

运行测试

JavaScript 测试可以从 Web 浏览器或命令行运行。

从网络浏览器测试

要从 Web 浏览器运行测试，请在浏览器中打开 js_tests/tests.html。

要在运行测试时测量代码覆盖率，您需要通过 HTTP 查看该文件。查看代码覆盖率：

从根目录（不是从 js_tests 内部）执行 python -m http.server。
在 Web 浏览器中打开 http://localhost:8000/js_tests/tests.html。

从命令行测试

要从命令行运行测试，您需要安装 Node.js。

安装 Node.js 后，通过从 Django checkout 的根目录运行以下命令来安装 JavaScript 测试依赖项：

然后运行测试：

JavaScript — Django 文档