【问题标题】:Is there a convention for renaming document.querySelector etc in JavaScript?是否有在 JavaScript 中重命名 document.querySelector 等的约定?
【发布时间】:2017-04-29 02:56:42
【问题描述】:

万一我是

  1. 编写 JavaScript
  2. 不想使用像 jQuery 这样的框架
  3. 想用更短的内容替换对“document.querySelector”的频繁调用
  4. 希望我的代码对于查看它的新开发人员来说仍然是可读和熟悉的

是否有任何常用的缩写来代替querySelector、querySelectorAll等?

这是一个关于命名约定的问题。 我不是在问如何 缩写一个长函数名。作为参考,你可以这样做 这个:

var queryAll = document.querySelectorAll.bind(document);

【问题讨论】:

  • 我不认为有关命名约定的问题非常适合 SO - 尽管我也想知道这个问题的答案。
  • 不,没有这样的约定。
  • 大多数时候不需要缩写,因为你不想直接与 DOM 交互。
  • querySelector 功能最常用的名称是$。这就是 jQuery、sizzle(jQuery 使用的选择器库)、原型、Google Chrome 调试器等使用
  • 除了像 jQuery 或 Eloquent 这样的流畅查询接口和像 DBAL 这样的低级抽象之外,我不知道有什么约定。

标签: javascript conventions


【解决方案1】:

不,没有。

此外,我认为使用缩写不是一个好主意。为什么要更改 Javascript API 只是为了缩短它?

您可以重复使用 $ 之类的内容,但您可能会给读者一种印象,即您正在使用使用该缩写的现有库。

其他一些注意事项:

  • 如果您后来决定添加使用相同缩写的库会怎样?你需要重构你的代码
  • 如果有人想要重用您的某些代码并且您的缩写与那里的代码或库发生冲突,会发生什么情况。
  • 使用现代编辑器/IDE,如果您使用自动填充,则使用缩写不太可能减少输入量
  • 对于学习 Javascript 的人来说,这很可能会使您的源代码难以阅读。

我过去这样做只是为了以后后悔。降低您的代码的可移植性。

简短的回答。不推荐。

【讨论】:

  • 这篇文章不错,但它没有回答问题在 JavaScript 中重命名 document.querySelector 等是否有约定? – 如果您只添加“否”。或“我不知道”或“不,因为……”一开始我会很乐意接受。
  • 编辑了我的帖子,从答案开始。
  • 这里没有人谈论不合理的缩写。但是document.querySelectorAll ... c'mon ... ,如果它必须在文档下,他们至少可以使其成为document.select() / document.select_one() 或直接在全球级别,如Selector() ...
  • @StevePallen 积分有效。我仍然更喜欢简洁,因此考虑到他将 Vanilla JavaScript 助手与 3rd 方库区分开来的谨慎,我将使用 v$ 和 v$$。
【解决方案2】:

我不知道

让我们做一些

现代 JS oneliner 可用于所有现代浏览器

Selector = (s,c) => (c ?? document).querySelectorAll(s);

用法

// search in the whole document
Selector('.some, .randomClasses');

// search only in the context of someParent
var someParent = Selector('.give .me .parent')[0];
Selector('img', someParent);

利用 arrow function expressionNullish coalescing operator (??)grouping operator ()
除非不明显,这总是returns the same stuff, querySelectorAll 会,您可以轻松调整它以与querySelector 类似,也许命名它例如SelectorOne,你懂的……

具有兼容性检查的更健壮的 JS

用法保持不变,但如果有人担心它会破坏东西:

if (typeof Selector != "undefined") {
  console.warn('CONFLICT WITH Selector! - please address this issue!')
} else {
  function Selector(selector, current_context) {
    if (typeof current_context == "undefined") {
      current_context = document;
    }

    return current_context.querySelectorAll(selector);
  }
}

为什么我选择命名“选择器”

  • 选择第一个大写字母的命名故意,因为接口通常是这样命名的,它稍微降低了全局级别的小猪代码冲突变量的风险
  • 没有将其命名为 Select,因为那含糊不清并且 可能暗示Selection which is a different experimental interface
  • Selector,在 HTML 和 CSS 世界中,已经足够具体了 :)


PS:我真的很想知道他们为什么要这么长时间,而这是人们使用繁重的库(如旧的 jQuery)而不是使用纯 JavaScript 的主要原因...我真的希望是技术原因...

【讨论】:

    猜你喜欢
    • 2014-02-14
    • 2012-04-09
    • 1970-01-01
    • 1970-01-01
    • 2015-09-30
    • 2012-05-07
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多