<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[lncci的博客]]></title><description><![CDATA[学习 生活]]></description><link>https://blog.youkuaiyun.com/lncci</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; lncci]]></copyright><item><title><![CDATA[【译】 React官方：函数组件与类组件的差异 ？]]></title><link>https://blog.youkuaiyun.com/lncci/article/details/88845874</link><guid>https://blog.youkuaiyun.com/lncci/article/details/88845874</guid><author>lncci</author><pubDate>Wed, 27 Mar 2019 15:21:01 +0800</pubDate><description><![CDATA[话外：随着 react 新特性 HOOKS 的提出，最新很多人开始讨论 react 里面的函数组件和 class 组件到底有什么不同？这里是 Dan Abramov 的一篇文章 How Are Function Components Different From Classes, 下面是对这篇文章的翻译，大致意思大致表达出来了，不足的地方，请大家多多指教 ：）
跳转：https://juejin...]]></description><category></category></item><item><title><![CDATA[chrome调试技巧]]></title><link>https://blog.youkuaiyun.com/lncci/article/details/88422854</link><guid>https://blog.youkuaiyun.com/lncci/article/details/88422854</guid><author>lncci</author><pubDate>Tue, 12 Mar 2019 16:08:50 +0800</pubDate><description><![CDATA[总结的掘金小册:你不知道的Chrome调试技巧里面的内容，部分有做总结，特别的章节满满的干货，就直接贴的链接。
通用：
Copying and saving
1、可通过copy拿到任何你能拿到的资源包括一些变量：copy(location)、copy($_)/copy($0)
2. store as global：相对数据做额外的操作，但不想影响原来的值；对console中打印的数据，右击 它，并...]]></description><category></category></item><item><title><![CDATA[从头条面试题看 JS 事件循环与 macro micro 任务队列]]></title><link>https://blog.youkuaiyun.com/lncci/article/details/88313328</link><guid>https://blog.youkuaiyun.com/lncci/article/details/88313328</guid><author>lncci</author><pubDate>Thu, 07 Mar 2019 16:53:04 +0800</pubDate><description><![CDATA[这里需要明白几个概念：同步任务、异步任务、task queue、microtask、macrotask

同步任务指的是，在主线程上排队执行的任务，只有前一个任务执行完毕，才能执行后一个任务；异步任务指的是，不进入主线程、而进入&amp;amp;amp;amp;amp;amp;quot;任务队列&amp;amp;amp;amp;amp;amp;quot;（task queue）的任务，只有&amp;amp;amp;amp;amp;amp;quot;任务队列&amp;amp;amp;amp;amp;amp;q]]></description><category></category></item><item><title><![CDATA[antd：ConfigProvider中为什么需要为 wave effect 动效，单独定义全局的 csp？]]></title><link>https://blog.youkuaiyun.com/lncci/article/details/88052031</link><guid>https://blog.youkuaiyun.com/lncci/article/details/88052031</guid><author>lncci</author><pubDate>Fri, 01 Mar 2019 11:18:06 +0800</pubDate><description><![CDATA[为什么：
在做波纹效果的时候添加了style标签的内联样式，为了防止xss攻击，可启动网站的内容安全策略，所以这里配置了csp属性，再将这个属性的值传递给子组件的style/script标签生成nonce属性。
分析：
ant-design组件中：Buttoon、Audio、Dropdown实现了水波纹效果，它们是应用了Wave组件(@/components/_utils/wave.tsx)，在C...]]></description><category></category></item><item><title><![CDATA[ReactV16.3即将更改的生命周期]]></title><link>https://blog.youkuaiyun.com/lncci/article/details/87969880</link><guid>https://blog.youkuaiyun.com/lncci/article/details/87969880</guid><author>lncci</author><pubDate>Wed, 27 Feb 2019 11:54:03 +0800</pubDate><description><![CDATA[一年多来，React团队一直致力于实现异步渲染。上个月，他在JSConf冰岛的演讲中，丹揭示了一些令人兴奋的新的异步渲染可能性。现在，我们希望与您分享我们在学习这些功能时学到的一些经验教训，以及一些帮助您准备组件以在启动时进行异步渲染的方法。

我们了解到的最大问题之一是，我们的一些传统组件生命周期会导致一些不安全的编码实践。他们是：

componentWillMount
	componentW...]]></description><category></category></item><item><title><![CDATA[react里面props到底是什么，怎么用。]]></title><link>https://blog.youkuaiyun.com/lncci/article/details/87934002</link><guid>https://blog.youkuaiyun.com/lncci/article/details/87934002</guid><author>lncci</author><pubDate>Tue, 26 Feb 2019 14:09:18 +0800</pubDate><description><![CDATA[概念
官网上是这么说的：

When React sees an element representing a user-defined component, it passes JSX attributes to this component as a single object. We call this object “props”.
意思是：当React看到表示用户定义组件的元素时，它会将...]]></description><category></category></item><item><title><![CDATA[无单位的行高值]]></title><link>https://blog.youkuaiyun.com/lncci/article/details/85172720</link><guid>https://blog.youkuaiyun.com/lncci/article/details/85172720</guid><author>lncci</author><pubDate>Fri, 21 Dec 2018 20:48:54 +0800</pubDate><description><![CDATA[line-height属性既可以接收无单位的数值，也可以使用带单位的数值（不建议这么使用）

当定义一个有单位的行高时，eg:line-height:1em,若后代元素没有定义行高，就会将父元素计算后的行高结果值传给全部的后代元素，注意这里的em是相对于当前元素的font-size来进行换算的。

当定义一个无单位的行高时eg:line-height:1.现在传给后代元素的是这个数字原始值，而不是...]]></description><category></category></item><item><title><![CDATA[重置样式表]]></title><link>https://blog.youkuaiyun.com/lncci/article/details/85129235</link><guid>https://blog.youkuaiyun.com/lncci/article/details/85129235</guid><author>lncci</author><pubDate>Thu, 20 Dec 2018 19:08:49 +0800</pubDate><description><![CDATA[浏览器有默认的样式表，即使开发者不对自己的页面写一行css代码，打开的页面也总会存在样式，但不同的浏览器的默认样式略有不同，这在一定程度上给开发者创造了麻烦，所以一般在开始写css代码的之前总是会先重置样式表。具体方法：

 css reset：访问https://meyerweb.com/eric/tools/css/reset ，将其中的重置代码复制粘贴到自己的css文件中，建议单独写一个cs...]]></description><category></category></item><item><title><![CDATA[词法作用域、动态作用域]]></title><link>https://blog.youkuaiyun.com/lncci/article/details/82998445</link><guid>https://blog.youkuaiyun.com/lncci/article/details/82998445</guid><author>lncci</author><pubDate>Wed, 10 Oct 2018 16:06:58 +0800</pubDate><description><![CDATA[在看《你不知道的JavaScript》的时候更加深入的了解了一下js中的作用域，看的是很带劲儿，但是总害怕记不住，好记性不如烂笔头嘛，所以我决定稍微写一些，考虑的不太全面，以后慢慢修改。

需要明确的是：事实上JavaScript并不具有动态作用域，它只有词法作用域，简单明了，但是this机制某种程度上很像动态作用域。


词法作用域：是一套引擎如何寻找变量以及会在何处找到变量的规则，它是定义在词...]]></description><category></category></item><item><title><![CDATA[同样不太好懂的箭头函数this的指向]]></title><link>https://blog.youkuaiyun.com/lncci/article/details/82901080</link><guid>https://blog.youkuaiyun.com/lncci/article/details/82901080</guid><author>lncci</author><pubDate>Sat, 29 Sep 2018 18:24:12 +0800</pubDate><description><![CDATA[1、先来看一个例子吧：（输出什么呢？）


var foo={
  foo:function(){
    console.log(this);
  },
  b:()=&amp;gt;{console.log(this)}
}
foo.foo();    foo.b();

答：foo.foo()//foo;

       foo.b()//window;


第一个foo.foo()是普通函数的执行...]]></description><category></category></item><item><title><![CDATA[最近的笔试和面试]]></title><link>https://blog.youkuaiyun.com/lncci/article/details/82873249</link><guid>https://blog.youkuaiyun.com/lncci/article/details/82873249</guid><author>lncci</author><pubDate>Thu, 27 Sep 2018 21:44:08 +0800</pubDate><description><![CDATA[笔试：


美丽联合：

1、console.log([&quot;a&quot;,,&quot;b&quot;,,].length)//4    注意这里未填写元素的位置的值为undefined。所以这里的length为4.但是最后一个，后面不会再补值。[&quot;a&quot;,,&quot;b&quot;,,]=&amp;gt;[&quot;a&quot;, undefined, &quot;b&quot;, undefined]


面试：

1、事件处理函数中的e.target和e.curren]]></description><category></category></item><item><title><![CDATA[jQuery绑定事件]]></title><link>https://blog.youkuaiyun.com/lncci/article/details/82751671</link><guid>https://blog.youkuaiyun.com/lncci/article/details/82751671</guid><author>lncci</author><pubDate>Tue, 18 Sep 2018 08:59:30 +0800</pubDate><description><![CDATA[现在还在使用的jQuery绑定事件的方法：on、bind(delete与live在jQuery1.7中被移出)

on-&amp;gt;off、bind-&amp;gt;unbind


1、bind(event,[data],function)

bind 是使用频率较高的一种，作用就是在选择到的元素上绑定特定事件类型的监听函数，参数的含义如下：

event：事件类型，如 click、change、mouse...]]></description><category></category></item><item><title><![CDATA[从[]==flase看js隐性转换]]></title><link>https://blog.youkuaiyun.com/lncci/article/details/82670019</link><guid>https://blog.youkuaiyun.com/lncci/article/details/82670019</guid><author>lncci</author><pubDate>Wed, 12 Sep 2018 23:08:58 +0800</pubDate><description><![CDATA[JS的数据类型

首先，回想一下JS的类型都有什么。

原始值（primitives）： undefined， null， booleans， numbers，strings， symbol（es6）

对象值（objects）： Object

ok， 这就是全部了，我们接下来看看到底发生了什么导致隐式转换如此不可捉摸。

ToPrimitive

在发生转换的时候，js其实都是会将操作对象转化...]]></description><category></category></item><item><title><![CDATA[css的关键字：initial、inherit、unset]]></title><link>https://blog.youkuaiyun.com/lncci/article/details/82664377</link><guid>https://blog.youkuaiyun.com/lncci/article/details/82664377</guid><author>lncci</author><pubDate>Wed, 12 Sep 2018 16:56:14 +0800</pubDate><description><![CDATA[经常会碰到，问一个 CSS 属性，例如 position 有多少取值。

通常的回答是 static、relative、absolute 和 fixed 。当然，还有一个极少人了解的 sticky 。其实，除此之外， CSS 属性通常还可以设置下面几个值：

initial
	inherit
	unset
	revert

			1

			2

			3

			4

			5

			6

	...]]></description><category></category></item><item><title><![CDATA[循环遍历]]></title><link>https://blog.youkuaiyun.com/lncci/article/details/82592328</link><guid>https://blog.youkuaiyun.com/lncci/article/details/82592328</guid><author>lncci</author><pubDate>Mon, 10 Sep 2018 17:14:39 +0800</pubDate><description><![CDATA[1、最简单的for循环

2、for····in····循环返回typeof为object的键名，不能直接获得键值

3、for···of···本质上是调用iterator接口产生的遍历器获得键值；


（1）使用for   of  遍历对象，因为自己生成的对象没有iterator接口，所以在直接循环访问对象时会报错。这时可以配合使用entries()、keys()、values()返回一个遍历器...]]></description><category></category></item><item><title><![CDATA[匿名函数的this指向]]></title><link>https://blog.youkuaiyun.com/lncci/article/details/82531467</link><guid>https://blog.youkuaiyun.com/lncci/article/details/82531467</guid><author>lncci</author><pubDate>Sat, 08 Sep 2018 17:30:15 +0800</pubDate><description><![CDATA[
var obj={
  x:1,
  xyz:function(){
    with(this){
      function con(){
        console.log(x);
        console.log(this.x);
      }
      var x=2;//因为是在obj对象上下文中执行的，所以这里对x的初始化，覆盖了上面的x:1;
      (fun...]]></description><category></category></item><item><title><![CDATA[猫眼面试]]></title><link>https://blog.youkuaiyun.com/lncci/article/details/82261826</link><guid>https://blog.youkuaiyun.com/lncci/article/details/82261826</guid><author>lncci</author><pubDate>Fri, 31 Aug 2018 23:20:55 +0800</pubDate><description><![CDATA[
1、三列布局（毕问题）:左右宽度固定，中间自适应


flex布局（超级简单易用）


html:
&amp;lt;div id=&quot;container&quot;&amp;gt;
  &amp;lt;div class=&quot;left&quot;&amp;gt;e&amp;lt;/div&amp;gt;
  &amp;lt;div class=&quot;main&quot;&amp;gt;jddhfg&amp;lt;/div&amp;gt;
  &amp;lt;div class=&qu]]></description><category></category></item><item><title><![CDATA[http强制缓存VS协商缓存]]></title><link>https://blog.youkuaiyun.com/lncci/article/details/82182788</link><guid>https://blog.youkuaiyun.com/lncci/article/details/82182788</guid><author>lncci</author><pubDate>Wed, 29 Aug 2018 14:45:32 +0800</pubDate><description><![CDATA[首先与缓存相关的header字段有：

与强制缓存相关：catch-control、expires

与协商缓存相关：Last-Modified/if-Modified-Since、Etag/if-None-Match.

 本文主要讲解浏览器端的缓存，缓存的作用是不言而喻的，能够极大的改善网页性能，提高用户体验。

1、浏览器缓存

缓存这东西，第一次必须获取到资源后，然后根据返回的信息来告诉如...]]></description><category></category></item><item><title><![CDATA[原生js写继承]]></title><link>https://blog.youkuaiyun.com/lncci/article/details/82055045</link><guid>https://blog.youkuaiyun.com/lncci/article/details/82055045</guid><author>lncci</author><pubDate>Sat, 25 Aug 2018 21:53:53 +0800</pubDate><description><![CDATA[js中实现继承的方法：

假设现在存在一个构造函数想继承另一个构造函数。


function Friend(){
  this.friend=&quot;xiaohua&quot;;
}
function Person(name,age){
    this.name=name;
    this.age=age;
    this.sayName=function(){
      console.log(&quot;he...]]></description><category></category></item><item><title><![CDATA[数组去重]]></title><link>https://blog.youkuaiyun.com/lncci/article/details/82048250</link><guid>https://blog.youkuaiyun.com/lncci/article/details/82048250</guid><author>lncci</author><pubDate>Sat, 25 Aug 2018 09:58:55 +0800</pubDate><description><![CDATA[1.双重循环去重，增加了额外的空间


function singelItem(array){
  var newArr=[];
  if(array.length===0){
    return;
  }
  for(var i=0;i&amp;lt;array.length;i++){
    if(i===0){//先添加进一个item
      newArr.push(array[i]);
 ...]]></description><category></category></item></channel></rss>