标签：JavaScript

共 776 篇相关文章

IT 累计浏览 2,724

从Java和JavaScript来学习Haskell和Groovy（元编程）

这篇文章深入探讨了四种主流编程语言在元编程领域的不同实现路径。作者首先定义元编程为“用程序写程序”，即运行时动态修改类结构的能力，并从Java的静态限制出发，介绍了其依赖JDK 5注解（如Lombok）和Spring框架（AOP、IoC）扩展元编程的方式；对于Haskell，则聚焦于Template Haskell通过抽象语法树（AST）和QuasiQuotation在编译期生成代码的方法，例如用`[| |]`构造自定义语法片段。对比动态语言，JavaScript的元编程基于对象自省和eval关键字，以极简性著称——通过prototype和动态属性添加实现灵活扩展；而Groovy则提供了更丰富的特性，如MethodMissing处理未知方法调用、GroovyInterceptable实现AOP拦截、Categories提供类似Objective-C的临时能力注入，以及Magic Package自定义元类（如通过命名规约修改String逻辑）。文章揭示了静态语言与动态语言在元编程灵活性上的核心差异：前者受限于编译期，后者则能自由操纵运行时环境。最终，作者对比了JavaScript的简洁设计与Groovy的功能多样性，指出语言选择如同工具取舍，关键在于程序员如何平衡需求与偏好。这种跨语言视角帮助读者理解元编程的本质，并为项目技术选型提供了清晰参考。

IT 累计浏览 2,324

JavaScript中的继承方式

这篇文章讲透了JavaScript中实现继承的两种经典方式：原型链继承与类式继承。作者首先厘清了JS中基于对象的核心特性——它不像Java那样拥有严格的“类”概念，而是更多依靠原型（prototype）机制。文章系统梳理了原型链继承如何通过对象间的原型链接实现属性与方法的共享，以及类式继承如何借助构造函数和apply/call方法来复用代码。为了帮助读者建立扎实的理解，文章特别定义了一套清晰的代码约定，区分了私有属性、实例属性与原型属性（包括基本类型与引用类型），为后续的深入分析奠定了明确的基础。作者指出，理解这些基本属性的归属与区别，是掌握不同继承方式适用场景与潜在陷阱的关键。无论是想搞懂JS对象模型的底层逻辑，还是为后续学习ES6 class语法打好基础，这篇文章都提供了扎实且细致的技术剖析。

IT 累计浏览 2,211

前端编码风格规范（3）—— JavaScript 规范

这篇讲的是前端 JavaScript 编码中几个关键的最佳实践，核心目标是避免全局命名空间污染并提升代码健壮性。文章首先强调，总是应该使用立即执行的函数表达式（IIFE）来包裹代码。这样做的好处是能创建独立的作用域，防止变量泄露到全局，也避免了代码被其他脚本意外修改。作者对比了 IIFE 的两种括号写法，并推荐将执行括号放在外层括号内部，以使表达式看起来更像一个整体。严格模式的启用时机也很有讲究。文章建议在 IIFE 内部激活严格模式，而不是在整个脚本的开头。这样既能获得更严格的错误检查和性能优化，又能避免因全局启用严格模式而影响到第三方库的正常运行。在变量声明方面，文章重申了必须始终使用 `var` 关键字。省略 `var` 会意外创建全局变量，使得作用域难以控制，而严格模式能帮助捕捉因变量名拼写错误导致的问题。总的来说，文章通过清晰的对比和示例，梳理了这些容易出错的细节，旨在引导开发者写出更隔离、更安全的 JavaScript 代码。

IT 累计浏览 3,372

前端编码规范（1）—— 一般规范

这篇讲的是前端开发中那些容易被忽视但至关重要的基础规范。作者从团队协作与代码质量的角度切入，清晰地梳理了制定一般性编码规范的核心意义。文章聚焦于HTML、JavaScript以及CSS/SCSS这几个前端基石，阐述了一套旨在统一风格、明确对错的准则。它强调，规范的价值不仅在于代码的整洁，更在于它能让潜在的问题——无论是风格不一致还是逻辑Bug——在早期就变得显而易见。当团队成员都严格遵守这些约定时，后续的代码审核便能更精准地定位错误，而各种压缩、编译工具也能更顺畅地工作。说到底，这篇指南提供的是一套可执行的“开发基石”，帮助团队在协作中减少无意义的摩擦，把精力更集中地投入到解决实际问题上。

IT 累计浏览 4,186

12行代码的浏览器DoS攻击分析及防御

这篇讲的是如何用12行JavaScript代码让主流浏览器甚至移动设备陷入DoS崩溃。作者从pjax技术所依赖的`history.pushState`接口切入，剖析了其工作机制：该接口允许无刷新修改URL并记录历史状态。攻击的核心在于一个循环：代码通过上万次调用`history.pushState`，不断向浏览器历史堆栈中堆积记录。这会导致页面地址被无意义的长字符串覆盖，CPU与内存占用率在短时间内飙升至100%，最终造成Chrome、Firefox、Safari等浏览器崩溃，甚至引发iPhone重启或Android应用闪退。作者在虚拟机环境中的实测数据，清晰展示了循环次数与系统资源耗尽之间的关联。在剖析原理的同时，文章也给出了面向用户的直接防御建议——保持安全意识，不轻易点击来源不明的链接。更深层次地，它提醒我们，现代Web API在提升体验的同时，也可能被滥用为攻击向量。开发者在使用这类接口时，需要考虑其潜在风险与边界情况。

IT 累计浏览 1,781

NodeJS的代码调试和性能调优

这篇讲的是NodeJS调试方法的演进与核心实践。作者从NodeJS版本合并的背景切入，指出许多开发者仍停留在`console.log`或`asserts`模块的基础调试阶段，这些方式需要将调试逻辑硬编码进业务代码。为此，文章详细介绍了NodeJS内建的命令行调试器作为更专业的解决方案。核心方法是通过`node debug`命令启动文件，进入一个提供丰富调试指令的环境。文章清晰地区分了“debug模式”（用于单步执行、设置断点）和“repl模式”（用于实时检查变量状态），并列举了`cont`、`next`、`step`等关键命令。这种调试方式通过TCP与内建模块通信，摆脱了在代码中“埋点”的束缚，让调试过程更干净、高效。文章最后也点出了调试器的工作原理，并提及IDE集成的图形化调试工具是其更友好的封装。其价值在于，它将调试从一种“破坏性”的辅助操作，转变为一种与代码分离的、系统化的质量保障流程。

IT 累计浏览 3,175

近几年前端技术盘点以及 2016 年技术发展方向

这篇讲的是，作者从自身2012年入行经历出发，对2009至2015年间前端技术的演进逻辑做了一次系统梳理与展望。文章并未停留在简单罗列，而是清晰勾勒出一条演进脉络：从早期jQuery等基础类库对浏览器差异的抹平与功能完善，到HTML5标准确立后对富应用与性能的关注，再到2013年后以Node.js、模块化、工程化工具链为标志的“大前端”生态构建。作者特别指出，技术革新的背后是Web从“网页”走向“应用”的根本诉求，以及浏览器标准化、移动端崛起、前后端分离等关键驱动力。文中对关键转折点的分析很有见地，例如14年HTML5定稿与ES6落地共同推动了大型Web应用开发成为可能；15年React Native等框架的兴起，则标志着前端技术开始突破浏览器边界，向跨平台原生开发渗透。作者将2016年展望为“低版本IE消亡”和“前端工业化生产”深化的一年，并呼吁业界共同推动标准落地与生态进化。这篇盘点将技术变迁置于具体的时间线与行业背景中，对理解前端技术的昨天、今天与明天提供了扎实的参考。

IT 累计浏览 2,260

从Java和JavaScript来学习Haskell和Groovy（DSL）

这篇讲的是如何借助Java和JavaScript的已有知识，来理解Haskell和Groovy中DSL（领域特定语言）的实现思路。文章开篇厘清了DSL的概念——它专注于特定领域，追求简洁与表达力，而非通用性。作者首先剖析了Java实现DSL的路径与局限。Java主要依赖链式调用和嵌套函数来构建结构，但受限于冗长的语法。随后，文章深入讲解了JDK8的闭包与Lambda表达式如何让Java拥有函数式编程的可能，使代码（如排序逻辑）得以大幅简化，并解释了`@FunctionalInterface`注解背后的原理。转向JavaScript时，文章指出其核心优势在于函数可作为“一等公民”，使得DSL能以更灵活、更具表现力的形式被编写，例如通过高阶函数实现数据流的流畅操作。最后，文章展示了Groovy为何是DSL的“天选之语”。它不仅语法糖丰富、代码接近自然语言，更提供了`MethodMissing`等特性，能优雅地构建如HTML生成器这样可读性极强的DSL示例。通过对比这三种语言的特性，文章清晰地呈现了它们在DSL实现上各自的适用场景与表达能力。

IT 累计浏览 2,278

JSON.parse()和JSON.stringify()方法总结

这篇讲的是JSON对象的两个核心方法：parse()与stringify()。作者从字符串与对象互相转换这一基本需求出发，清晰拆解了这对方法。 parse()负责“解析”，将符合JSON格式的字符串转换成可用的JavaScript对象，其translator参数允许自定义转换逻辑。而stringify()则执行反向的“序列化”，将对象转为字符串，并重点介绍了它强大的格式化能力：通过replacer参数可以选择性序列化指定属性，通过space参数则能控制输出字符串的缩进层级（数字指定空格数，字符串用作缩进符），大幅提升可读性。文章通过对比示例与运行效果截图，直观展示了不同参数组合下的输出差异，比如如何只输出“name”字段，或如何用“###”作为缩进。最后，作者特别强调了一个实践原则：应避免使用eval()方法来解析JSON，指出了其潜在风险。对于前端开发者而言，这篇文章将这两个高频使用的方法讲得细致透彻，不仅说明了“怎么用”，还阐释了“怎么用更好”，是扎实的技术参考。

IT 累计浏览 2,018

DOM中Property与Attribute的区别

这篇讲的是前端开发中一个经典又容易踩坑的问题：DOM里Property和Attribute到底有什么不同。虽然中文都常被译作“属性”，但它们在JS和HTML中的角色、行为与生命周期有着本质区别。文章从源头梳理了二者的核心定义：Property是JS对象的属性，可以是任意类型，主要用于JS操作；而Attribute是HTML的特性，值始终是字符串，并通过`getAttribute/setAttribute`方法操作，直接体现在DOM结构上。一个关键背景是，在IE<9时代，浏览器将二者强制映射，这给许多开发者留下了“它们是一回事”的误解。作者重点剖析了它们之间复杂的同步关系。自定义的Property与Attribute互不干涉；而非自定义的属性（如`id`, `src`, `value`）则有条件同步——例如，用`setAttribute`修改`input`的`value`会同步到Property，但通过`.value`赋值却不会反向同步到Attribute。`href`/`src`等属性的取值方式也不同，`getAttribute`拿到的是原始值，而Property则是完整的URL。对于开发者而言，理解这个区别至关重要，尤其是在使用jQuery等库的`.attr()`和`.prop()`方法时，混淆二者可能导致难以排查的UI状态同步bug。文章最后用一张关系图清晰总结了这些复杂情况。

IT 累计浏览 1,916

[JavaWeb教程]第二章-jQuery简明开发教程

这篇讲的是jQuery的入门基础，作者从“write less, do more”这个核心理念出发，带读者快速上手。文章明确指出，jQuery之所以能成为超半数热门网站的共同选择，关键在于它极大地简化了原生JavaScript的操作，尤其是页面元素的获取与修改。教程从引入jQuery文件讲起，用一个“Hello World”例子演示了文档就绪事件和基础事件绑定。核心篇幅集中讲解了jQuery强大的选择器：从最简单的id、标签、class三种基础选择，到能应对复杂场景的层级、属性和筛选等组合选择方式。作者通过示例代码清晰展示了如何灵活定位目标元素。在获取元素后，教程进一步说明了如何通过`.val()`、`.text()`、`.attr()`和`.html()`等方法，动态更新页面的值、文本、属性乃至整体HTML结构。这部分内容直接指向了动态网页开发最根本的需求——响应用户交互来改变页面呈现。对于初学者来说，这是一条从“引入”到“操作”的明确路径。

IT 累计浏览 5,660

Node.js 给前端带来了什么

这篇讲的是 Node.js 如何重新定义前端工程师的职责边界。作者从传统 Web 开发中“两个 UI 层”的割裂现象切入——前端只能控制浏览器内的表现，而负责生成页面的服务端 UI 层通常由后端主导，这导致数据如何呈现往往受限于后端技术栈，前后端协作存在天然隔阂。文章的核心观点是：Node.js 的出现让前端工程师可以用熟悉的 JavaScript 操控服务端 UI 层，从而打通前后端。具体来说，在面向服务架构下，后端只需提供稳定的 RESTful 接口处理数据逻辑，而前端通过 Node.js 可以完全自主地进行页面渲染、模板处理和交互逻辑，不再被后端的技术选择所掣肘。这种分工模式将前后端通过数据接口解耦，双方可以独立高效迭代。作者也提到，这需要打破“JavaScript 只是玩具语言”的偏见，但实际效果显著：前端获得了对完整 UI 链路的控制权，后端则从不擅长的页面拼接工作中解放，最终提升的是整体开发效率和用户体验。

IT 累计浏览 2,118

你不该忽视的小问题之margin叠加篇

这篇讲的是CSS中一个常被低估但至关重要的细节——外边距叠加（margin collapsing）。作者从开发者常见的“浏览器bug”抱怨入手，指出了深入理解CSS机制的必要性。文章通过清晰的图示和实验，梳理了三种外边距叠加的典型场景：相邻块级元素的垂直外边距合并、父子元素在特定条件下的外边距穿透，以及空块元素自身的上下外边距合并。作者特别强调，这些现象只在普通文档流的块框上出现，且针对的是垂直方向。针对最易被忽视的父子元素叠加，文章后半部分做了重要修正和深化。它明确列出了发生叠加所需满足的一系列条件，例如父元素未创建BFC（块格式化上下文）、无边框、无内边距等。相应地，解决思路也变得清晰：为父元素创建BFC，或为其添加适当的border/padding。文章还补充了创建BFC的常见方式，如设置overflow不为visible、使用浮动或绝对定位等。作者不仅仅是在列举知识点，更是在引导一种解决问题的思维方式——遇到现象不能敷衍了事，而要追问“为什么”并动手验证。这对于希望建立扎实CSS基础、减少布局困惑的开发者来说，是一次从表象到原理的梳理。

IT 累计浏览 1,719

由NodeJieba谈谈Node.js异步实现

这篇文章以NodeJieba这个中文分词库的源码为例，深入浅出地拆解了Node.js异步操作的底层实现原理。作者没有停留在理论层面，而是直接打开`cut`函数的C++实现代码，带领读者一步步看清异步调用的“幕后”。核心思路非常清晰：当我们在JavaScript中调用异步的`cut`函数时，实际是创建了一个`CutWorker`对象并将其推入`NanAsyncQueueWorker`队列。真正的耗时分词操作`segment.cut()`在后台线程的`Execute`方法中静默执行，完成后则通过`HandleOKCallback`回到主线程触发回调。文章特别点明了两个巧妙而关键的设计：一是`CutWorker`必须用私有成员变量（如`inputStr`）来保持状态，确保后台线程执行时参数依然有效，即使原栈变量已销毁；二是整个异步非阻塞的魔力，正源于“主线程只负责投递任务，后台线程持续轮询队列并执行”这一经典线程池模型。通过这个具体的例子，作者揭示了Node.js异步的本质其实并不高深，它无非是“状态保存”与“后台队列执行”两个核心环节的组合，为许多初学者揭开了异步编程的神秘面纱。

IT 累计浏览 2,617

一个“三端”开发者眼中的React Native

这篇讲的是一位常年穿梭于前端、服务端和客户端的“三端”开发者，初次接触React Native时的真实感受与深度观察。作者没有停留在技术介绍，而是从自己饱受iOS开发中代码冗长、布局繁琐、调试耗时等痛点困扰的经历出发，生动地分享了RN如何像一位“校花”般用统一的Component模型、动态绑定、类CSS样式和Flexbox布局，解决了这些长期痛点。文章直率地列举了RN当前阶段的不足，比如组件不全、性能损耗、仅支持iOS以及代码并非全平台通用等现实问题。但核心价值在于作者提出的理性视角：技术讨论不能脱离场景。他从前端与客户端两个角度分析了RN带来的影响——对前端而言，这是拓展技术栈的有趣方向；对客户端开发者，它简化了开发流程，并带来了更高效的NPM生态。最后，作者展望了一种未来的协作模式：前端负责表层业务开发，客户端团队则专注于构建和封装底层原生组件。文章结尾鼓励开发者不要止于议论，而应动手实践，在学习中积累。这种从个人实践上升到团队协作模式的思考，为如何看待这类跨平台技术提供了切实的参考。

IT 累计浏览 1,694

js代码因逗号不规范导致IE不兼容的问题

作者分享了一个在前端开发中容易遇到的兼容性陷阱：代码在Chrome、Firefox中运行正常，但在IE中却抛出“Expected identified, string or number”的错误。经过排查，根因是JavaScript对象字面量的最后一个属性后多写了一个逗号（trailing comma），这是老版本IE无法容忍的语法不规范。文章展示了如何用Eclipse的正则搜索（`,\\s*}`）来定位这类问题，但也指出了该方法对注释中的代码无效的局限。因此，作者更推荐使用Spket这类IDE插件，它能在编码阶段实时检查并标记出代码中的不规范之处，帮助开发者从源头避免问题。此外，文章还提醒，像`console`对象这类在IE中不存在的API也是常见的兼容性问题源，需要一并清理。总的来说，作者从实际项目报错出发，不仅给出了具体的排错和代码规范化工具，也强调了对运行时环境差异保持警惕的重要性。处理已知的兼容性“坑”很重要，而借助工具养成规范的编码习惯，是更根本的预防之道。

IT 累计浏览 1,434

javascript定义对象的几种方法

这篇讲的是JavaScript中定义对象的几种经典方法。作者从最基础的对象扩充开始，逐步深入到工厂方式、构造函数、原型方式，最后介绍了试图融合两者优点的动态原型方式。文章的核心价值在于对这些方式的细致对比。比如，它指出了“工厂方式”虽然方便，但每次创建对象都会生成新的函数实例，无法共享；而“构造函数方式”配合`new`关键字更规范，但方法不共享的问题依然存在。真正的突破点在于“原型方式”，它通过`prototype`让所有实例共享同一个方法，但作者也用代码清晰地演示了其中的陷阱：基本类型的属性变更不会同步，但引用类型（如数组）的变更却会在所有实例间反映出来。最终，文章推荐了“动态原型方式”，它像一个精巧的折中方案：在构造函数内部通过一个标志变量，确保方法只添加一次到原型上，这样既保证了每个实例拥有独立的属性，又实现了方法的高效共享。这篇文章清晰地展示了每种方案的代码实现与适用场景，帮你理解为何需要从一种方式演进到另一种。

IT 累计浏览 2,198

JavaScript初体验

这篇文章源于作者一次愉快的阅读体验。在读完《JavaScript语言精粹》后，他结合自己的使用经历，分享了几个对JavaScript印象最深的特点。作者认为，JavaScript的灵活性是其核心魅力。比如“函数即变量”的特性，为异步和回调提供了天然支持；而JSON作为JS的“最伟大副产品”，极大地简化了数据序列化过程，对比传统语言的RPC工具堪称“酸爽”。他同时指出，抛开“原型继承”、“闭包”等看似高深的标签，JS其实是一门简单的语言，其Array、Object、函数参数等设计都透着直接和灵活。文章也记录了作者的一些个人疑惑：他质疑JSONP在URL里写回调的方式是否足够优雅，思考Promise之外更佳的异步解决方案，并对Node.js在后端生态的统治地位表达了既批判又看好的复杂态度。在书评部分，他认为本书相比冗长的《权威指南》更为“接地气”。通篇来看，这更像是一位有经验的开发者，在语言特性、生态现状和学习资源之间穿梭，给出的个人化思考笔记。对于想了解JS本质魅力或资深开发者心得的读者，其中的观察角度很有启发。

IT 累计浏览 2,478

用JavaScript将数字转换为大写金额

这篇讲的是前端开发中一个常见但容易被忽视的需求：如何在JavaScript里将数字金额规范地转为“壹佰贰拾叁元整”这样的大写汉字格式。作者直接分享了一个可以拿来即用的`digitUppercase`函数。它的核心思路很清晰：先用两个数组分别定义好“零”到“玖”和“角”、“分”等单位，然后通过循环和取余运算，逐位将数字映射到对应的大写汉字和货币单位上。函数巧妙地用正则表达式对转换后的字符串进行了多次清洗，处理了像“零元零角”这样可能出现的冗余情况，确保输出的格式既准确又符合中文财务书写习惯。这个实现考虑得比较周全，能正确处理负数、小数（到分）以及像万亿这样的大额数字。对于需要实现发票打印、账单生成等场景的开发者来说，这段代码可以直接解决实际问题。

IT 累计浏览 2,471

跨域访问和防盗链基本原理（二）

这篇文章深入拆解了Web前端跨域访问的核心原理，重点对比了两种主流解决方案：JSONP与CORS。作者从跨域访问的定义切入，清晰区分了浏览器Referer请求与脚本发起请求在安全性上的根本差异——后者可能被恶意利用截获数据，因此成为需要重点管控的技术问题。文章详细剖析了JSONP的工作机制：它巧妙地利用了浏览器允许加载外部脚本的特性，通过客户端预先定义函数、服务端返回调用该函数的脚本代码来传递数据。作者也客观指出了JSONP的局限：只能发起GET请求、依赖客户端与服务端的特定配合，且数据必须是JSON格式。随后，文章将视角转向更现代的CORS方案。这里作者解释了其核心是服务端通过设置HTTP响应头（如Access-Control-Allow-Origin）来显式授权跨域访问。浏览器在正式发送请求前，会通过OPTIONS预检请求与服务端协商权限，这一流程使得跨域访问的控制权更规范地回归到了服务端。文中配有的流程图，清晰地展示了这一交互过程。最后，文章简要提及了服务器代理、修改域标识等其他方案，但明确指出JSONP与CORS构成了当前跨域访问实践的两大基石。整体上，文章从原理到实践，系统地梳理了这一前端关键技术点的演进与现状。