About JavaScript built in class: URL

Reference meterials.

今天在 Vue 中尝试绑定 Lodash 防抖动函数 (debounce), 在传入闭包函数的时候遇到了一点问题, 其实是对箭头函数和引用传递的机制理解不够.

Vue 拷贝特定内容到剪切板有一个专门的库 vue-clipboard, 但是不太好用, 而且很简单的功能引入一个库代价太大, 可以自己用几句代码简单实现下.

JavaScript 属于描述型脚本语言, 在运行时由浏览器进行动态解析和执行, 在此过程中有一些特殊的行为模式, 合格的 JavaScript 程序员应该对此有清楚的了解.1704

JavaScript 中，某些事件，如 'input'，'resize'，'scroll'，可以在很短时间内频繁触发，如果把逻辑函数直接绑定到这些事件上，会严重影响运行性能，甚至造成更大的麻烦，比如把 ajax 请求直接绑定到 'input' 事件上，将在用户输入时产生频率很高的 ajax 请求，给服务器造成不必要的响应压力。

当函数返回时，调用者能够拿到预期结果，则称该函数是 同步 (synchronous) 的，反之称该函数是 异步 (asynchronous) 的。就是说，在主线程内完成的任务是同步的，主线程外产生额外线程的任务是异步的。

因为.data()不会设置data-*的属性值. 尽管.data()获取的数据初始化自data-*属性, 但在添加和修改的过程中不会改变元素的data-*属性. 正确的做法是使用.attr()方法:

$('.div').attr("data-foo", "bar")

参考资料

JQuery .data() not working?

很多情况下需要向表单输入事件添加绑定, 监听的事件主要是 "input" 和 "change" 两个. 此二者在功能和行为上存在诸多不同.

我相当乐意花一整天的时间通过编程把一个任务实现自动化, 除非这个任务手动只需要 10 秒钟就能完成.

Douglas Adams, Last Chance to See

数据是不应当影响指令的正常运行的. 精心设计的应用应当将关键数据从主要的源码中抽敦聘来, 这样我们修改源码时才能更加放心.

编程实践是另外一类编程规范. 代码风格规范只关心代码的呈现, 而编程实践则关心编码的结果. 可以将编程实践看作是 "秘方" 一一它们指引开发者以某种方式编写代码, 这样做的结果是书籍的. 如果你使用过一些设计模式比如 MVC 中的观察者模式, 那么你已经对编程实践很熟悉了. 设计模式是编程实践的组成部分, 专用于解决和软件组织相关的特定问题.

注释是代码中最常见的组成部分. 注释是另一种形式的文档, 也是程序员最后才舍得花时间去写的. 但是, 对于代码的总体可维护性而言, 注释是非常重要的一环.

由于前端工程师的成长道路和自成轨迹, 这让 (Web 前端技术) 这个专业看起来是如此的与众不同, 甚至诸如 Yahoo! 这种大公司里的很多前端工程师也多是靠自身野蛮生长, 我行我素地写着各种 hack! . 当这些 hacker 碰到了各种条条框框. 单兵作战再没了优势, 所有那些自觉成都和以自我为中心的人都不得不开始思考如何才能在团队环境中生存下来.

对 DOM 事件传播 (propagation) , 捕获 (capturing) 和冒泡 (bubbling) 的理解是处理复杂 JavaScript 事件逻辑必须掌握的能力.

闭包是 JavaScript 新手最容易遇到的一个问题, 之所以说新手, 是因为闭包在 JavaScript 中出现得非常频繁, 是理解 JavaScript 这门语言必须掌握的概念.

(该文作于11年, 有部分内容已经过时, 但仍有参考价值)

AJAX(Asynchronous JavaScript and XML)：异步的JavaScript和XML。

AJAX不是新的编程语言，而是一种使用现有标准的新方法。是在不需要重新加载网页的情况下，与服务器进行数据交互并更新部分网页的技术。

You can convert a string to an integer using the built-in parseInt() function. This takes the base for the conversion as an optional second argument, which you should always provide.

在没有设置 value 值的情况时用以下方法:

$('#option-lock:checked').val();

复选框被选中时以上值为 'on', 否则为 'undefined'

设置复选框的状态

$('#option-lock').prop('checked',true);