<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[fedlover的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/fedlover</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; fedlover]]></copyright><item><title><![CDATA[前端基础进阶（四）：作用域与作用域链]]></title><link>https://blog.youkuaiyun.com/fedlover/article/details/103348471</link><guid>https://blog.youkuaiyun.com/fedlover/article/details/103348471</guid><author>fedlover</author><pubDate>Mon, 02 Dec 2019 14:43:13 +0800</pubDate><description><![CDATA[文章最新内容已迁移至公众号 不知非攻，后续维护也在公众号里修正，欢迎关注。

作用域与作用域链本应该是一个非常简单的概念。可是在近两年多的留言中，我发现这些概念反而成为了大多数人想不明白的点，而感到困惑的原因在于，别的文章里，常常会提到词法作用域，词法分析等概念，到底是什么东西？好像跟我说的有一点不一样，但又不知道哪里不对？
为了避免接下来更多的同学造成同样的困扰，我写了一篇名为（v8引擎是如...]]></description><category></category></item><item><title><![CDATA[前端基础进阶（三）：变量对象详解]]></title><link>https://blog.youkuaiyun.com/fedlover/article/details/103348437</link><guid>https://blog.youkuaiyun.com/fedlover/article/details/103348437</guid><author>fedlover</author><pubDate>Mon, 02 Dec 2019 14:41:39 +0800</pubDate><description><![CDATA[文章最新内容已迁移至公众号 不知非攻，后续维护也在公众号里修正，欢迎关注。

在JavaScript中，肯定不可避免的需要声明变量和函数，JS编译器是如何找到这些变量的呢？
我们还得对执行上下文有一个进一步的了解。
在上一篇文章中已经知道，当调用一个函数时（激活），一个新的执行上下文就会被创建。一个执行上下文的生命周期可以分为两个阶段。

创建阶段

在这个阶段中，执行上下文会分别创建变量对象...]]></description><category></category></item><item><title><![CDATA[前端基础进阶（二）：执行上下文详细图解]]></title><link>https://blog.youkuaiyun.com/fedlover/article/details/103348419</link><guid>https://blog.youkuaiyun.com/fedlover/article/details/103348419</guid><author>fedlover</author><pubDate>Mon, 02 Dec 2019 14:40:50 +0800</pubDate><description><![CDATA[本系列最新文章已迁移至公众号 不知非攻，欢迎关注跟进

我们在JS学习初期，或者在面试的时候常常会遇到变量提升相关的思考题。
比如先来一个简单一点的。
console.log(a);   // 这里会打印出什么？
var a = 20;

暂时先不管这个例子，我们先引入一个JavaScript中最基础，但同时也是最重要的概念：执行上下文（Execution Context）
每次当控制器转到可...]]></description><category></category></item><item><title><![CDATA[前端基础进阶（一）：内存空间详细图解]]></title><link>https://blog.youkuaiyun.com/fedlover/article/details/103348364</link><guid>https://blog.youkuaiyun.com/fedlover/article/details/103348364</guid><author>fedlover</author><pubDate>Mon, 02 Dec 2019 14:38:38 +0800</pubDate><description><![CDATA[文章最新内容已迁移至公众号 不知非攻，后续维护也在公众号里修正，欢迎关注。

var a = 20;
var b = 'abc';
var c = true;
var d = { m: 20 }

因为JavaScript具有自动垃圾回收机制，所以对于前端开发来说，内存空间并不是一个经常被提及的概念，很容易被大家忽视。特别是很多不是计算机专业的朋友在进入到前端之后，会对内存空间的认知比较模糊，...]]></description><category></category></item><item><title><![CDATA[超性感的React Hooks（十一）useCallback、useMemo]]></title><link>https://blog.youkuaiyun.com/fedlover/article/details/103347989</link><guid>https://blog.youkuaiyun.com/fedlover/article/details/103347989</guid><author>fedlover</author><pubDate>Mon, 02 Dec 2019 14:21:46 +0800</pubDate><description><![CDATA[在实践开发中，有一种优化手段叫做记忆函数。
什么是记忆函数？用一个例子来说明。
我们想要计算从1到某个整数的总和。封装一个方法来实现这个目的。
function summation(target: number) {
  let sum = 0;
  for(let i = 1; i &lt;= target; i++) {
    sum += i;
  }
  return sum;
}

验...]]></description><category></category></item><item><title><![CDATA[超性感的React Hooks（十）useRef]]></title><link>https://blog.youkuaiyun.com/fedlover/article/details/103347975</link><guid>https://blog.youkuaiyun.com/fedlover/article/details/103347975</guid><author>fedlover</author><pubDate>Mon, 02 Dec 2019 14:21:09 +0800</pubDate><description><![CDATA[import {useRef} from 'react';

在函数式组件中，useRef 是一个返回可变引用对象的函数。该对象.current属性的初始值为useRef传入的参数initialVale。
返回的对象将在组件整个生命周期中持续存在。
const ref = useRef(initialValue);

通常情况下，useRef有两种用途，

访问DOM节点，或者React元素
保持...]]></description><category></category></item><item><title><![CDATA[超性感的React Hooks（九）useContext实践]]></title><link>https://blog.youkuaiyun.com/fedlover/article/details/103347958</link><guid>https://blog.youkuaiyun.com/fedlover/article/details/103347958</guid><author>fedlover</author><pubDate>Mon, 02 Dec 2019 14:20:16 +0800</pubDate><description><![CDATA[如上图所示。
我们利用useContext来实现这个小demo。在实现之前，复习一下相关比较重要的知识点。
如下图。

1
如何合理的拆分组件？
这是一个需要在实践中，不断去总结，优化才能获得的技能。
首先，将一个复杂的页面逻辑进行拆分的目的，一定是为了可读性和可维护性。如果你的组件拆分违背了这两个原则，那么拆分就有问题。
本来我想根据我自己的经验，将组件分为基础组件，工具组件，容器组件，页面组...]]></description><category></category></item><item><title><![CDATA[超性感的React Hooks（八）useContext]]></title><link>https://blog.youkuaiyun.com/fedlover/article/details/103347936</link><guid>https://blog.youkuaiyun.com/fedlover/article/details/103347936</guid><author>fedlover</author><pubDate>Mon, 02 Dec 2019 14:19:26 +0800</pubDate><description><![CDATA[在context这个高级API出来之前，数据流向只能自上而下，从父组件一层一层的往下传递。如上图左。
如果仅仅只支持这样的方式，在实践中会遇到很多麻烦。
例如一个数据要传到使用它的组件，中间还要经历3个组件。我们就不得不在这三个中间组件中处理该数据的传递逻辑。但其实对于这三个组件而言，该数据毫无用处。
context的出现，就是为了解决这样的痛点。context能够让数据直达需要它的那一个子组件...]]></description><category></category></item><item><title><![CDATA[超性感的React Hooks（七）useReducer]]></title><link>https://blog.youkuaiyun.com/fedlover/article/details/103347918</link><guid>https://blog.youkuaiyun.com/fedlover/article/details/103347918</guid><author>fedlover</author><pubDate>Mon, 02 Dec 2019 14:18:38 +0800</pubDate><description><![CDATA[useReducer是React hooks提供的API之一，它和redux的使用几乎一样。因此如果你熟悉redux，那么自然就已经知道如何去使用useReducer了。
1
我用最简单的递增递减的案例，来和大家分享一下它的用法。
最终实现效果如图。

首先从React中引入
import React, { useReducer } from ‘react’;

然后需要定义一个状态值，以表示us...]]></description><category></category></item><item><title><![CDATA[超性感的React Hooks（六）自定义hooks的思维方式]]></title><link>https://blog.youkuaiyun.com/fedlover/article/details/103347904</link><guid>https://blog.youkuaiyun.com/fedlover/article/details/103347904</guid><author>fedlover</author><pubDate>Mon, 02 Dec 2019 14:17:47 +0800</pubDate><description><![CDATA[今天Spenser在公众号里说，今年许多公司都在裁员。市场上供大于求，但是，好多企业还是招不到人。真正的人才，市面上太稀缺了。这句话真的深有体会。我们公司想要招一个Java的高级开发，招了一个多月都没找到满意的。真的痛苦。
出现这种局面，两极分化就会日渐严重。就以前端行业来看，厉害的人，会越来越难找，也会越来越值钱。而普通的人，混口饭吃都不容易。
还是那句话说得对，外面的世界很精彩，可精彩是属于真...]]></description><category></category></item><item><title><![CDATA[超性感的React Hooks（五）：自定义hooks]]></title><link>https://blog.youkuaiyun.com/fedlover/article/details/103347890</link><guid>https://blog.youkuaiyun.com/fedlover/article/details/103347890</guid><author>fedlover</author><pubDate>Mon, 02 Dec 2019 14:16:55 +0800</pubDate><description><![CDATA[1
在实践中，我们常常会遇到逻辑相同的功能片段。对于这样的场景，更省力的方式是，将这些功能片段封装成为一个单独函数来使用。
例如，比较两个数组是否相等，可以封装一个equal方法，来处理这个通用逻辑。
export default function equalArr(a: number[], b: number[]) {
  if (a.length !== b.length) {
    ret...]]></description><category></category></item><item><title><![CDATA[超性感的React Hooks（四）：useEffect]]></title><link>https://blog.youkuaiyun.com/fedlover/article/details/103347861</link><guid>https://blog.youkuaiyun.com/fedlover/article/details/103347861</guid><author>fedlover</author><pubDate>Mon, 02 Dec 2019 14:15:51 +0800</pubDate><description><![CDATA[1
想不想验证一下自己的React底子到底怎么样？或者验证一下自己的学习能力？
这里有一段介绍useEffect的文字，如果你能够从中领悟到useEffect的用法，那么恭喜你，你应该大概率是个天赋型选手。
那么试试看：
在function组件中，每当DOM完成一次渲染，都会有对应的副作用执行，useEffect用于提供自定义的执行内容，它的第一个参数（作为函数传入）就是自定义的执行内容。为了避...]]></description><category></category></item><item><title><![CDATA[超性感的React Hooks（三）：useState]]></title><link>https://blog.youkuaiyun.com/fedlover/article/details/103347836</link><guid>https://blog.youkuaiyun.com/fedlover/article/details/103347836</guid><author>fedlover</author><pubDate>Mon, 02 Dec 2019 14:14:52 +0800</pubDate><description><![CDATA[这几天和许多同学聊了使用React Hooks的感受。总体感觉是，学会使用并不算难，但能用好却并不简单。
索性拉了一个React Hooks的讨论群，抽空时间在群里纠正大家的使用方式。如果持续关注群消息，能够学到许多正确的使用方式。感兴趣的同学速度进群，如果提示满人，公众号回复React Hooks获取进群方式。


后进群的不用担心，每天的讨论的内容，我都会记录在语雀讨论组中，任何时候进群都能...]]></description><category></category></item><item><title><![CDATA[超性感的React Hooks（二）再谈闭包]]></title><link>https://blog.youkuaiyun.com/fedlover/article/details/103347780</link><guid>https://blog.youkuaiyun.com/fedlover/article/details/103347780</guid><author>fedlover</author><pubDate>Mon, 02 Dec 2019 14:12:30 +0800</pubDate><description><![CDATA[如果你一天没有真正理解它，你就应该继续学习它。
曾经我去找工作面试的时候，我最讨厌别人问我闭包，因为我说不清楚。现在我面试别人了，却又最爱问闭包，因为闭包真的能直接的检验你对JS的理解深度。可能够回答上来的人真的很少。
两年以来我面试过估计200多人，其中技术能力最强的是阿里P6的一个胖胖的哥们儿，这里简称PP。PP的JS基础很扎实，对React的理解比较深刻，其他问题上我们聊得很开心。可即使是...]]></description><category></category></item><item><title><![CDATA[超性感的React Hooks（一）：为何她独具魅力]]></title><link>https://blog.youkuaiyun.com/fedlover/article/details/103344816</link><guid>https://blog.youkuaiyun.com/fedlover/article/details/103344816</guid><author>fedlover</author><pubDate>Mon, 02 Dec 2019 10:52:52 +0800</pubDate><description><![CDATA[正如标题所示，我准备写一系列文章介绍React Hooks。
过去大半年里，我将React Hooks应用到了许多大型项目，其中5个全新重构，其他项目由于时间关系少量使用。
这些项目包括

React Native
基于ant-design-pro重构的中后台应用
基于React，专注于小程序开发的Taro应用
以create-react-app为基础，自主构建的web应用
基于beidou框架...]]></description><category></category></item></channel></rss>