咖啡机（K.F.J）_社区达人页

2022年04月

• 04.26 18:43:58
  发表了文章 2022-04-26 18:43:58

  React躬行记（2）——JSX

  JSX既不是字符串，也不是HTML，而是一种类似XML，用于描述用户界面的JavaScript扩展语法，如下代码所示。在使用JSX时，为了避免自动插入分号时出现问题，推荐在其最外层用圆括号包裹，并且必须用一个元素包裹（例如下面的<div>元素）其它元素或文本，所有的元素还必须得闭合。

  
• 04.26 18:34:55
  发表了文章 2022-04-26 18:34:55

  React躬行记（1）——函数式编程

  　　函数式编程是React的精髓，在正式讲解React之前，有必要先了解一下函数式编程，有助于更好的理解React的特点。函数式编程（Functional Programming）不是一种新的框架或工具，而是一种以函数为主的编程范式。编程范式也叫编程范型，是一类编程风格，除了函数式编程，常用的还有面向对象编程、命令式编程等。
• 04.26 18:34:44
  发表了文章 2022-04-26 18:34:44

  程序员健康指南

  　最近找到了一本有趣的书《程序员健康指南》，此书关注的重点不仅在于预防软件开发者短期的物理并发症，还在于长期保持心血管的健康。那些长时间对着电脑工作、一天下来基本不怎么走动的人，患高血压及2型糖尿病的风险远高于其他人群，这两种疾病会对人体的健康产生长久的严重影响，还会增加心脏病及中风的几率。

  
• 04.26 18:34:32
  发表了文章 2022-04-26 18:34:32

  前端学习之路，分享给刚学或想学前端的网友（持续更新中）

  　　经常会在群里或论坛上看到有人问：“学习前端有什么捷径？”，一般都是卖油翁式的回答：“无他唯手熟尔”。那么该如何让手熟练呢？其实也就是该如何系统的学习前端。在本文中，我会结合自身的经历，分享一下自己学习前端的过程，期间会穿插引用我过去各个阶段所写的博文。
• 04.26 18:33:43
  发表了文章 2022-04-26 18:33:43

  ES6躬行记（24）——代理和反射

  代理和反射是ES6新增的两个特性，两者之间是协调合作的关系，它们的具体功能将在接下来的章节中分别讲解。
• 04.26 17:28:18
  发表了文章 2022-04-26 17:28:18

  ES6躬行记（23）——Promise的静态方法和应用

  　　Promise有四个静态方法，分别是resolve()、reject()、all()和race()，本节将着重分析这几个方法的功能和特点。
• 04.26 17:26:20
  发表了文章 2022-04-26 17:26:20

  ES6躬行记（22）——Promise

  　　在JavaScript中，回调函数是处理异步编程的常用解决方案，但层层嵌套的回调金字塔（如下代码所示）一直受人诟病，因为不仅在视觉上更加混乱，而且在管理上也更为复杂。
• 04.26 17:21:34
  发表了文章 2022-04-26 17:21:34

  ES6躬行记（21）——类的继承

  　　ES6的继承依然是基于原型的继承，但语法更为简洁清晰。通过一个extends关键字，就能描述两个类之间的继承关系（如下代码所示），在此关键字之前的Man是子类(即派生类)，而在其之后的People是父类（即基类或超类）。
• 04.26 16:55:21
  发表了文章 2022-04-26 16:55:21

  ES6躬行记（20）——类

  　　ES6正式将类（Class）的概念在语法层面标准化，今后不必再用构造函数模拟类的行为。而ES6引入的类本质上只是个语法糖（即代码更为简洁、语义更为清晰），其大部分功能（例如继承、封装和复用等）均可在ES5中实现，只不过现在能用更符合面向对象的语法来操作类。但诸如接口、protected修饰符等一些面向对象常用的语法，ES6没有给出相关标准。
• 04.26 16:52:22
  发表了文章 2022-04-26 16:52:22

  ES6躬行记（19）——生成器

  　　根据ES6制订的标准自定义迭代器实现起来比较复杂，因此ES6又引入了生成器的概念，生成器（Generator）是一个能直接创建并返回迭代器的特殊函数，可将其赋给可迭代对象的Symbol.iterator属性。与普通函数不同，生成器不仅可以暂停函数内部的执行（即维护内部的状态），在声明时还需要包含一个星号（*），并且拥有next()、return()和throw()三个迭代器方法。
• 04.26 16:41:47
  发表了文章 2022-04-26 16:41:47

  ES6躬行记（18）——迭代器

  　　ES6将迭代器和生成器内置到语言中，不仅简化了数据处理和集合操作，还弥补了for、while等普通循环的不足，例如难以遍历无穷集合或自定义的树结构等。
• 04.26 16:38:28
  发表了文章 2022-04-26 16:38:28

  ES6躬行记（17）——Map

  　　Map类似于Object（对象），可用来存储键值对，但需要通过SameValueZero算法保持键的唯一性。与Set一样，在使用之前也得要实例化，如下代码所示，构造函数Map()中的参数也是一个可选的可迭代对象，但此对象得是键值对的集合或两列的二维数组。
• 04.26 16:35:59
  发表了文章 2022-04-26 16:35:59

  ES6躬行记（16）——Set

  　　ES6引入了两种新的数据结构：Set和Map。Set是一组值的集合，其中值不能重复；Map（也叫字典）是一组键值对的集合，其中键不能重复。Set和Map都由哈希表（Hash Table）实现，并可按添加时候的顺序枚举。
• 04.26 16:34:01
  发表了文章 2022-04-26 16:34:01

  ES6躬行记（15）——箭头函数和尾调用优化

  　箭头函数（Arrow Function）是ES6提供的一个很实用的新功能，与普通函数相比，不但在语法上更为简洁，而且在使用时也有更多注意点，
• 04.26 16:30:36
  发表了文章 2022-04-26 16:30:36

  ES6躬行记（14）——函数

  　　在前面的章节中，已陆陆续续介绍了ES6为改良函数而引入的几个新特性，本章将会继续讲解ES6对函数的其余改进，包括默认参数、元属性、块级函数和箭头函数等。
• 04.26 16:23:44
  发表了文章 2022-04-26 16:23:44

  ES6躬行记（13）——类型化数组

  　　类型化数组（Typed Array）是一种处理二进制数据的特殊数组，它可像C语言那样直接操纵字节，不过得先用ArrayBuffer对象创建数组缓冲区（Array Buffer），再映射到指定格式的视图（view）之后，才能读写其中的数据。总共有两类视图，分别是特定类型的TypedArray和通用类型的DataView。在ES6引入类型化数组之后，大大提升了JavaScript数学运算的性能。
• 04.26 16:20:00
  发表了文章 2022-04-26 16:20:00

  ES6躬行记（12）——数组

  　　ES6为数组添加了多个新方法，既对它的功能进行了强化，也消除了容易产生歧义的语法。
• 04.26 16:18:10
  发表了文章 2022-04-26 16:18:10

  ES6躬行记（11）——对象

  　　在第5篇中，讲解了多个对象字面量的改进，本节将重点介绍两个新增的静态方法，以及对象属性的重复处理和枚举顺序。
• 04.26 16:15:12
  发表了文章 2022-04-26 16:15:12

  ES6躬行记（10）——正则表达式

  　　在ES5中，如果使用构造函数RegExp()初始化RegExp对象（即正则表达式），并且它的第一个参数是正则表达式时，那么不允许再传入标志字符串（即第二个参数）。而ES6更改了这项限制，如果传入了第二个参数，那么就会取代第一个参数中的标志，如下所示。
• 04.26 16:13:37
  发表了文章 2022-04-26 16:13:37

  ES6躬行记（9）——字符串

  　　在介绍字符串之前，有必要先了解一点Unicode的基础知识，有助于理解ES6提供的新功能和新特性。
• 04.26 16:10:31
  发表了文章 2022-04-26 16:10:31

  ES6躬行记（8）——数字

  　　ES6不仅完善了数字的八进制形式，还补充了一种十六进制形式，并且添加了全新的二进制形式。下面的三个变量分别表示八进制、十六进制和二进制的10，注释中给出了该进制的另一种写法。
• 04.26 16:08:45
  发表了文章 2022-04-26 16:08:45

  ES6躬行记（7）——代码模块化

  　　在ES6之前，由于ECMAScript不具备模块化管理的能力，因此往往需要借助第三方类库（例如遵守AMD规范的RequireJS或遵循CMD规范的SeaJS等）才能实现模块加载。而自从ES6引入了模块化标准后，就不需要再特地加载一次外部脚本了。模块化的语法不仅让JavaScript代码的组织变得更有条理，还包含封装、按需导出或导入等实用功能，可轻松应对日益复杂和庞大的前端工程。但有一点要注意，模块中的代码默认运行在严格模式中。
• 04.26 16:04:12
  发表了文章 2022-04-26 16:04:12

  ES6躬行记（6）——Symbol

  　　本节将会重点分析ES6引入的第6种基本类型：Symbol（符号）。符号可以像字符串那样作为对象的属性名，只是它有唯一性的特点，可以避免属性名之间的冲突。
• 04.26 14:16:15
  发表了文章 2022-04-26 14:16:15

  ES6躬行记（5）——对象字面量的扩展

  　　当创建对象字面量时，如果属性值是与属性同名的已定义的标识符（例如变量、常量等），那么ES6允许省略冒号和属性值，这样就能避免冗余的初始化。下面分别用传统的键值对和最新的简写方式创建对象字面量，可以明显的看出，第二种书写起来更加精炼。
• 04.26 14:14:16
  发表了文章 2022-04-26 14:14:16

  ES6躬行记（4）——模板字面量

  　　模板字面量（Template Literal）是一种能够嵌入表达式的格式化字符串，有别于普通字符串，它使用反引号（`）包裹字符序列，而不是双引号或单引号。模板字面量包含特定形式的占位符（${expression}），由美元符号、大括号以及合法的表达式组成，合法的表达式（expression）可以是变量、算术或函数调用，甚至还可以是模板字面量。在ES6引入模板字面量后，就能避免用若干个加号来实现字符串拼接，而改用更为优雅的语法来替代，下面用新旧两种方式分别来组合字符串。
• 04.26 14:09:39
  发表了文章 2022-04-26 14:09:39

  ES6躬行记（3）——解构

  　解构（destructuring）是一种赋值语法，可从数组中提取元素或从对象中提取属性，将其值赋给对应的变量或另一个对象的属性。解构地目的是简化提取数据的过程，增强代码的可读性。有两种解构语法，分别是数组解构和对象解构，两者的区别在于解构赋值语句的左侧，前者是数组字面量，而后者是对象字面量。为了说明解构的优势，下面用一个例子来对比手动赋值和解构赋值。
• 04.26 13:54:46
  发表了文章 2022-04-26 13:54:46

  ES6躬行记（2）——扩展运算符和剩余参数

  　　扩展运算符（Spread Operator）和剩余参数（Rest Parameter）的写法相同，都是在变量或字面量之前加三个点（...），并且只能用于包含Symbol.iterator属性的可迭代对象（iterable）。虽然两者之间有诸多类似，但它们的功能和应用场景却完全不同。扩展运算符能把整体展开成个体，常用于函数调用、数组或字符串处理等；而剩余参数正好相反，把个体合并成整体，常用于函数声明、解构参数等。此处的整体可能是数组、字符串或类数组对象等，个体可能是字符、数组的元素或函数的参数等。
• 04.26 13:49:08
  发表了文章 2022-04-26 13:49:08

  ES6躬行记（1）——let和const

  　　古语云：“纸上得来终觉浅，绝知此事要躬行”。的确，不管看了多少本书，如果自己不实践，那么就很难领会其中的精髓。自己研读过许多ES6相关的书籍和资料，平时工作中也会用到，但在用到时经常需要上搜索引擎中查询相关知识概念，并且对很多知识也仅仅是略知一二，没有领会到其中的原理。为此，开辟了《ES6躬行记》系列，将ES6相关的知识系统的记录下来，以便自己翻阅，也希望能帮助到广大网友。
• 04.26 13:46:21
  发表了文章 2022-04-26 13:46:21

  【翻译】停止学习框架（Stop Learning Frameworks）

  　　我们作为程序员，对技术要时刻保持着激情，每天都需要不断地学习编程语言、框架或库，并且会的工具越多越好。很多人都还会觉得学习Angular、React、Vue、Riot、Ember和Knockout等框架是一件有趣而高大上的事情。

  
• 04.26 13:43:09
  发表了文章 2022-04-26 13:43:09

  我喜欢这样阅读一本书

  　　每年各大电商都会推出图书满减活动，每次我都会屯些书，然而在以前，这些书买了后经常放在书架上吃灰，给自己的理由就是没时间看。现在想想是自己当时看的方法不对，由于对每本书都是事无巨细无差别的从头开始一篇篇的看，看的时候也不注意笔记，因此经常是读了后面的忘了前面的，读完整本书，能记得的内容寥寥无几。平时如果用不到的话，等于是白读了，久而久之，就越来越不喜欢阅读书籍了，但屯书的习惯倒没变。

  
• 04.26 13:37:13
  发表了文章 2022-04-26 13:37:13

  防御式编程和开发者测试

  　　《代码大全》第8章介绍了防御式编程，这是一种提高软件质量技术的有益辅助手段，其核心思想是：程序不应该传入错误数据而被破坏。第22章介绍了开发者测试，测试是最常见的改善质量的活动，有些测试需要开发人员进行，例如单元测试、组件测试和集成测试。

  
• 04.26 13:35:34
  发表了文章 2022-04-26 13:35:34

  120分钟React快速扫盲教程

  在教程开端先说些题外话，我喜欢在学习一门新技术或读过一本书后，写一篇教程或总结，既能帮助消化，也能加深印象和发现自己未注意的细节，写的过程其实仍然是一个学习的过程。有个记录的话，在未来需要用到相关知识时，也方便自己查阅。

  
• 04.26 13:10:24
  发表了文章 2022-04-26 13:10:24

  忆2011年的秋天：一个人的项目

  　　最近在知乎上看到有人问“一个人开发一个项目是一种怎样的体验？”，这让我想起了2011年刚出道那会儿的项目经历。当时在一家旅游公司工作，整个公司就我一个技术，老板和我们算是校友，通过关系在我们学校招一个人过来做开发，主要维护公司的网站。当时比较流行的社交平台是开心网，老板突发奇想，让我们也做个类似的系统，就叫驴友驿站（目前已经下线），刚出来混，一听要做个这么好玩的系统，马上就一头扎进去了。当时是个热血青年，看到公司的网站是用古老的ASP做的，马上就想将其改版，但碍于时间不够，只能先搁置，完成当前的任务才是该做的事情，顺便为自己将要用的相关技术试试水。

  
• 04.26 13:06:38
  发表了文章 2022-04-26 13:06:38

  横看成岭侧成峰，远近高低各不同——从面试官的角度谈面试

  　最近有一本很红的面试书叫《剑指Offer：名企面试官精讲典型编程题》，作者是美国微软总部资深软件工程师何海涛，他在书中以面试官的角度分享了程序员面试的方方面面，并且还在书中停供了80余道面试题，大部分是与数据结构和算法有关。本文不会重点分析这些面试题目，而是归纳总结书中所提到的一些面试相关的编程技能和软技能。
• 04.26 11:48:52
  发表了文章 2022-04-26 11:48:52

  使用Scratch进行少儿编程

  　　在上一篇《初识少儿编程》曾提到过Scratch的脚本标签内包含10大模块，本文将围绕这10大模块展开，分为两部分：积木和编程概念，结合《动手玩转Scratch2.0编程―STEAM创新教育指南》一书进行分析。

  
• 04.26 11:44:50
  发表了文章 2022-04-26 11:44:50

  初识少儿编程

  少儿编程并不需要写代码，而是以简单易用的图形化编程为主，注重趣味性和可玩性，学习目标不是培养未来的程序员，而是培养孩子的思维、学习和独立解决问题的能力，以及培养探索、创新和协作等精神。少儿编程所使用的编辑器有很多，例如Scratch、Etoys、Alice等，本文将要介绍的编辑器是Scratch。

  
• 04.26 00:10:41
  发表了文章 2022-04-26 00:10:41

  一份来自于全球的前端面试题清单，看看老外喜欢考哪些题（部分有答案）（三）

  方括号中的蓝色标题是题目的出处，有些题目在原址内包含答案。搜集的大部分外国前端面试题没有做翻译，单词并不难，大家应该看得懂。题目旁边的方括号内， 简单记录了与此题相关的知识点。总共大概一千多道，包含国内的题目，如有错误，欢迎指正。有些原链可能已无法打开，有些可能需要代理才能查看。
• 04.26 00:06:50
  发表了文章 2022-04-26 00:06:50

  一份来自于全球的前端面试题清单，看看老外喜欢考哪些题（部分有答案）（二）

  　方括号中的蓝色标题是题目的出处，有些题目在原址内包含答案。搜集的大部分外国前端面试题没有做翻译，单词并不难，大家应该看得懂。题目旁边的方括号内， 简单记录了与此题相关的知识点。总共大概一千多道，包含国内的题目，如有错误，欢迎指正。有些原链可能已无法打开，有些可能需要代理才能查看。
• 04.26 00:02:17
  发表了文章 2022-04-26 00:02:17

  一份来自于全球的前端面试题清单，看看老外喜欢考哪些题（部分有答案）（一）

  　　方括号中的蓝色标题是题目的出处，有些题目在原址内包含答案。搜集的大部分外国前端面试题没有做翻译，单词并不难，大家应该看得懂。题目旁边的方括号内， 简单记录了与此题相关的知识点。总共大概一千多道，包含国内的题目，如有错误，欢迎指正。有些原链可能已无法打开，有些可能需要代理才能查看。
• 04.26 00:01:59
  发表了文章 2022-04-26 00:01:59

  程序员也需要的软技能，既为了生存，也为了早日财务自由

  　最近读了一本不是编程的程序员技能书《软技能 代码之外的生存指南》，全书分为7个篇章，分别是职业、自我营销、学习、生产力、理财、健身和精神。其中在读过职业、自我营销和理财这三个篇章后，让我非常有感触，也让我很意外，本来以为国外的软件环境会与国内不同，现在看来很多情况都很类似。下面会着重围绕这三个篇章展开讨论。
• 04.26 00:01:49
  发表了文章 2022-04-26 00:01:49

  软文营销实战记录

  最近拜读了徐茂权老师的《 网络营销决胜武器(第2版)》，下面会梳理书中的内容，记录下以后可能会用到的软文营销的技巧。
• 04.26 00:01:41
  发表了文章 2022-04-26 00:01:41

  前端程序员修炼之路：积土而为山，积水而为海

  　首先插播一条好消息，新书《前端程序员面试笔试宝典》已于9月在各大平台上架，现免费送出4本（看到大家热情这么高涨，幸运人数已提升至4人），具体参与规则如下所列：

  
• 04.26 00:01:15
  发表了文章 2022-04-26 00:01:15

  开源网站流量统计系统Piwik源码分析——后台处理（二）

  　　在第一篇文章中，重点介绍了脚本需要搜集的数据，而本篇主要介绍的是服务器端如何处理客户端发送过来的请求和参数。

  
• 04.26 00:01:05
  发表了文章 2022-04-26 00:01:05

  开源网站流量统计系统Piwik源码分析——参数统计（一）

  　Piwik现已改名为Matomo，这是一套国外著名的开源网站统计系统，类似于百度统计、Google Analytics等系统。最大的区别就是可以看到其中的源码，这正合我意。因为我一直对统计的系统很好奇，很想知道里面的运行原理是怎么样的，碰巧了解到有这么一个系统，因此马上尝试了一下。国内关于该系统的相关资料比较匮乏，大多是分享怎么安装的，并没有找到有关源码分析的文章。下面先对其做个初步的分析，后面会越来越详细，本人目前的职位是前端，因此会先分析脚本代码，而后再分析后台代码。

  
• 04.25 23:57:47
  发表了文章 2022-04-25 23:57:47

  面试的自信来源于扎实的基础

  面试的自信来源于扎实的基础

  
• 04.25 23:52:22
  发表了文章 2022-04-25 23:52:22

  数学思维修炼

  《程序员的数学思维修炼（趣味解读）》、《生活中的数学》和《生活中的概率趣事》，下面会对本书的知识点做个梳理。

  
• 04.25 23:33:08
  发表了文章 2022-04-25 23:33:08

  程序员也需要工匠精神

  　　最近有点浮躁，也有点膨胀，工作也提不起劲，有点混混的节奏。 　　在此期间看到了本书《工匠精神》，读了几遍，矫正了一下自己。正像高达OO中的人物们一样，找到了一个战斗的理由。

  
• 04.25 23:30:40
  发表了文章 2022-04-25 23:30:40

  《代码大全》中的变量

  《代码大全》中的变量

  
• 04.25 23:26:20
  发表了文章 2022-04-25 23:26:20

  前端页面数据埋点、分析和参考

  前端页面数据埋点、分析和参考
• 04.25 23:23:35
  发表了文章 2022-04-25 23:23:35

  认识Nginx，理解原理和功能

  前端工程师在理解Nginx之后，就能更好的与后端工程师沟通，为了能提高工作效率，这两天抽空读了《Nginx高性能Web服务器实战教程》。