我做开发那些年

引言ES6（ECMAScript 2015）作为 JavaScript 语言发展的里程碑版本，对原生Object进行了全方位的升级优化。这些扩展不仅简化了对象的创建与操作语法，还补充了此前缺失的核心功能（如原型操作、属性遍历、深度复制支持等），彻底改变了 JavaScript 开发者的编码习惯。本文将系统拆解 ES6 对象的六大核心扩展特性，结合实战代码示例，让每个特性的应用场景一目了然。 一、对象字面量的语法简化ES6 大幅简化了对象字面量的声明语法，减少冗余代码，提升可读性。 1.1 属性简写当对象属性名与变量名一致时，可省略冒号（:）和属性值，直接简写为属性名： 12345678910// ES5写法const name = "张三";const age = 28;const user = { name: name, age: age};// ES6简写const user = { name, age }; // 等价于ES5写法 1.2 方法简写对象方法声明可省略function关键字和冒号，直接使用方法名...

数组是 JavaScript 处理数据的核心结构，ES6（ECMAScript 2015）对数组的扩展，解决了传统操作的繁琐问题，让数据处理更高效。下面我们来结合实例，梳理 ES6 数组的核心扩展特性与用法。 一、语法层面的突破：扩展运算符扩展运算符（...）是 ES6 中最具代表性的语法糖之一，它将数组或类数组对象展开为独立的元素，彻底改变了数组拷贝、合并、参数传递等常见操作的实现方式。 1. 数组拷贝传统拷贝数组需借助slice()或concat()，ES6 中使用扩展运算符更为简洁直观，且支持深拷贝一维数组： 123456789101112131415// 浅拷贝一维数组const arr1 = [1, 2, 3];const arr2 = [...arr1]; // [1, 2, 3]arr2[0] = 100;console.log(arr1); // [1, 2, 3]（原数组不受影响）// 对比ES5写法const arr3 = arr1.slice();const arr4 = [].concat(arr1); 2. 数组合并无需再依赖concat()的链式调用...

很喜欢华裔哲学家、武术家李小龙先生的一句话：“清空你的杯子，方能再行注满。” 这句话用杯子比喻人的思想与知识 —— 当杯子被装满时，便再也容不下新的事物；唯有先将其倒空，才能持续注入新的知识，实现自我迭代与进步。​ 那些陈旧的知识、自认为有用的经验，以及曾经屡试不爽的方法，都是杯子里的 “水”。它们像一层厚厚的茧，既为我们提供了保护，也成了束缚成长的枷锁。​ “切图仔” 真的没有 “茧” 吗？这时候或许有人会问：“什么杯子、什么水的，和我一个切图仔又有什么关系？我天天写页面，从没见过什么‘茧’啊？”​ 并非没有茧，只是我们自己未曾察觉罢了。​ 开发者的 “螺丝困境”现在的互联网公司，岗位分工能细致到什么程度？细致到使用 Vue 和 React 两个框架开发，都要分成两个独立团队 —— 一个专职写 Vue，一个专职写 React。这对公司的管理与开发效率来说是好事，但对开发者的职业发展而言，未必如此。​ 要知道，一颗螺丝即便打磨得再光亮，终究只是颗螺丝，只能固定在专属的位置上。而这些 “螺丝” 之所以不自知，不过是仗着自己对 Vue 或 Reac 路径依赖有个概念大家或许都听说过 ...

程序员的职业路不算长，可不少人早早就遇到了 “天花板”：想提升没方向，想突破没抓手，这就是让人头疼的 “瓶颈期”。是什么让我们陷入这种困境？又该怎么走出来？咱们一点点说清楚。 摆烂心态在程序员不算长的职业生涯里，真正能实现能力跃升的黄金期，可能也就那么几年。但仅凭这几年积累的经验，在大厂“搬几年砖”解决户口问题，通常难度不大。 从入职一家公司到从“新人”熬成“老油条”，快则半年到一年，慢则两年。为什么不会更久？试想，要是两年都没给你涨工资，你还会在领导面前刻意扮演“奋斗逼”吗？ 于是，很多人就此进入“摆烂模式”。佛系的工作态度，自然没法带来个人能力和技术的提升——摆烂心态，正是造成个人能力瓶颈的一大关键原因。 基础不牢，地动山摇“这个世界就是个草台班子”，这句话你永远可以信。那些看似厉害的软件，说不定都是月薪几千块的外包（作者自己也曾是其中一员）写的；你可能想不到，一个简单的功能，会被写成十几个 if else 判断，或是三四层嵌套的 for 循环。 上班的本质是挣钱糊口，不是为了靠技术“装X”——反正最后把东西做出来不就行了？大多数人抱着这样的想法，其实没什么错。 可要是自己技...

做 Web 开发有些年头了，目前头发还算茂密，只是人已不再少年。​ 当年上班摸鱼都有负罪感的 “小油条”，如今也成了佛系的 “老油条”。​ 相似的业务代码写得越多，那种难以压抑的枯燥感就越强烈 —— 写这坨代码有什么用？像极了一个渣男，经历过一次次短暂的感情后，最终丢掉了最初初见佳人时的心动。​ 今天想简单聊聊个人能力提升那点事，以及自己是如何从 “小油条” 走到 “老油条” 这条路上的。​ 能力提升的两个关键期对于靠互联网开发谋生的程序员来说，我觉得有两个时期是个人能力提升的关键期。​ 初遇编程的 “热恋期”第一个关键期，自然是刚接触编程那会儿。对新事物的好奇，还有靠自己编程实现功能的喜悦，像磁石一样深深地吸引着你。 想起自己刚开始做 Web 开发时，常常因为一些问题折腾到凌晨三四点。分析问题、上网查解决方案、修改验证，一遍又一遍。没有因一次次失败而沮丧，只有对一次次接近成功的欣喜。现在回想起来，都忍不住夸自己一句 “好小子”。​ 独挑项目的 “破茧期”第二个关键期，是需要独自负责一个项目开发的时候。2021 年去北京出差时，当时 Web 开发还处于 “炼气期” 的我，直接被甲...

每个开发者大概都有个小梦想——做一款属于自己的软件，被很多人用，要是还能赚点钱就更好了。可现实是，不少好想法哪怕做成了产品，最后也难免中途夭折。原因五花八门，运营恰恰是很多开发者的短板；更现实的是“收益”问题——纯靠“爱发电”的项目能走多远，其实谁也说不准。 我的小程序《豆豆证照工坊》上线半个多月后，我也遇上了这个难题。 上周微信团队发消息说，我的云环境欠费了。一开始我以为这东西是免费的，后来才搞明白：小程序上线前，云环境对开发者是免费的；可一旦正式上线，就得开始付费了。 登录后台一看，好家伙——两周的瑞幸咖啡钱直接没了，还没算那个每月19.9元的“穷鬼套餐”（基础版）。这哪儿是“爱发电”啊，分明是拿我的咖啡钱在发电。这下我不得不认真想了：软件得有收益，至少得能覆盖基础支出吧？ 纠结这事儿的时候，心里其实挺矛盾的。一方面，总希望自己花时间琢磨出来的产品，能被更多人喜欢、用上，还能帮到大家；可另一方面，“得靠收益支撑软件运行”的现实又摆在哪儿——每一次接口调用、图片处理、数据存储，都在消耗资源，总有人得为这些买单。 纠结了好一阵，最后还是选了“要钱不要脸”——开始考虑收费。 不过以...

最近后台收到好多朋友的留言，说刷到了我之前写的那篇关于证照制作小程序的文章（传送门），还跟着体验了小程序。 说实话，看到文章突然 “火” 起来的时候，我第一反应是惊讶，紧接着就是满满的感动 —— 原来认真分享的东西，真的能被这么多人看见和需要。 最意外的：被 “戳中” 的共鸣感一开始写这篇文章，只是想记录下自己用小程序拍证件照的惊喜体验。毕竟谁没经历过 “为了一张一寸照，请假跑照相馆，排队 1 小时、拍照 5 分钟，最后拿到的照片还不像自己” 的糟心时刻呢？ 没想到文章发出去后，评论区彻底 “炸” 了 —— 有朋友说 “我去, 好用啊 白花了25去照相馆换底色”，也有用户在小程序后台留言说“很好用，给老人办理证件的时候很方便”。看着这些留言，我突然明白：这篇文章能火，不是我写得有多好，而是它刚好戳中了大家对 “便捷生活工具” 的需求。原来我们都在期待：生活里那些琐碎的小事，能少一点麻烦，多一点省心。 最实在的：小程序被 “看见” 的喜悦文章爆火后，最直接的变化就是小程序的用户量涨得特别快。后台数据显示，文章发完的第二天，就涌入了将近200的用户，其中绝大多数都是来自咱们园子(博客...

在 JavaScript 的世界里，原型和原型链是绕不开的核心概念，它们构建了 JS 独特的继承机制，也让许多开发者既好奇又头疼。今天我们就从几个关键角度，一起揭开它们的神秘面纱。 基于类与基于原型：两种不同的编程范式在传统的面向对象编程语言中，比如 Java、C++，基于类（Class-based） 是主流的编程思想。在这种范式里，类就像是一个模具，它定义了对象所具有的属性和方法，而对象则是类的实例。我们必须先定义好类，然后通过new关键字来创建该类的对象，对象之间的关系是通过类的继承来确立的。 而 JavaScript 则不同，它采用的是基于原型（Prototype-based） 的编程范式。在这种模式下，并没有严格意义上的类的概念（虽然 ES6 引入了class语法，但这只是语法糖，底层依然是基于原型实现的）。对象可以直接从其他对象继承属性和方法，我们可以把原型看作是一个模板对象，新创建的对象会以这个模板为基础，共享它的属性和方法。 举个简单的例子，在基于类的编程中，我们先定义一个 “动物” 类，规定动物有 “名字” 属性和 “移动” 方法，然后 “猫” 类继承 “动物” ...

三周前，帮朋友拍证件照时差点吵起来 —— 他要白底一寸照，我用修图软件改背景，边缘总留着灰边，最后还是花 30 块去照相馆拍的。看着他吐槽 “拍个照还要跑一趟”，我突然冒了个念头：要不自己做个证件照小程序？当时也就随口一说，转头就打开电脑，真的开始琢磨起来了。 半路出家选方向没纠结，就定证件照制作。之前帮人改照片总出错，要么尺寸不对，要么背景色不标准；身边朋友也常说，临时要个证件照，找修图软件半天弄不明白，去照相馆又费时间。想着做个轻量化工具，核心功能就三个：标准化尺寸调整（覆盖一寸、二寸、社保照等常用规格）、背景色一键替换（白 / 蓝 / 红三色标准色值）、电子版保存，暂时不做复杂的美颜功能，先保证基础可用性。 真正动手才知道难。我是个半路出家的，之前只跟着网课学过基础的微信小程序开发，真要搭项目框架时，对着微信开发者工具的文档发呆能发一下午。第一天晚上熬到两点，好不容易弄出个能上传照片的静态页面，结果点击 “确认上传” 按钮毫无反应，排查半天才发现绑定的事件函数名写错了；更糟的是保存代码时误删了 pages 目录，当时坐在电脑前盯着黑屏，差点把鼠标扔了。 ...

闭包，算得上是JavaScript中的一个难点，在面试时也被时常提及。 多年前的一次面试，被问及闭包时，那种脑子里一团乱麻的感觉，至今依然清晰。 本文力求以简单移动柜的语言，彻底讲清楚闭包，让读者在日后的面试和工作中，少走一些弯路，少掉一些头发。 什么是闭包？要讲清楚闭包，那么我们首先得了解闭包是什么。为此，我翻阅许多资料收集了其中关于闭包的定义： 《JavaScript权威指南（第六版）》： 函数对象可以通过作用域链相互关联起来，函数体内部的变量都可以保存在函数作用域内，这种特性在计算机科学文献中称之为“闭包”。 《JavaScript 高级程序设计》： 闭包指的是那些引用了另外一个函数作用域中变量的函数，通常是嵌套在函数中实现的。 《你不知道的JavaScript》： 函数可以记住并访问所在词法作用域，即使函数实在当前词法作用域之外执行，这就产生了闭包。 MDN: 闭包是由捆绑起来（封闭的）的函数和函数周围状态（词法环境）引用组合而成，闭包让函数能够访问它的外部作用域。 好嘛，真是一看一个不吱声，根本没有一个统一的定义。有的说闭包是特性，有的直说是怎么形成的，各...