任正非讲话全集1994-2019.pdf

任正非讲话全集1994-2019.epub

任正非讲话全集1994-2019.mobi

任正非媒体采访实录201901-201905.pdf

查看原文

1
2
3
4
5
6
7
8
9
10

var add = function(x){
  return function(y){
    return x + y
  }
}

console.log(add(1)(2))//3

var add1 = add(1)
console.log(add1(1))//2

代码中，我们可以一次性传入 1 个 2 作为参数 add(1)(2) ，也可以传入 1 个参数之后获取 add1 函数，这样使用起来非常灵活。

。也就是说，无论你在什么地方声明变量和函数，解释器都会将它们移动到作用域的最前面。因此我们可以先使用变量和函数，而后声明它们。
但是，仅仅是变量声明被提升了，而变量赋值不会被提升。如果你不明白这一点，有时则会出错：

1
2

console.log(x)//undefined
x = 2//初始化x

所谓模块化，就是根据需要控制模块内属性与方法的可访问性，即私有或者公开。

在代码中，

module 为一个独立的模块

name 为其私有属性

work 为其私有方法

age 为其公有属性

say 为共有方法

正如很多 JS 库比如 jQuery 以及我们 Fundebug 都是这样实现的

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

var module = (function(){
  var name = "allen";
  function work(){
    console.log("working")
  }
  function say(){
    console.log("hello world Im allen")
  }
  return {
    age: 100,
    say: say
  }
})()
console.log(module.age)//100
console.log(module.say())//hello world Im allen

所谓模块化，就是根据需要控制模块内属性与方法的可访问性，即私有或者公开。

在代码中，

module 为一个独立的模块

name 为其私有属性

work 为其私有方法

age 为其公有属性

say 为共有方法

1
2
3
4
5
6
7
8
9
10
11
12
13

function Square(w,h){
  this.width = w
  this.height = h
}
Square.prototype.getArea =  function(){
  return this.width * this.height
}

var s1 = new Square(10,20)
var s2 = new Square(30,40)

console.log(s1.getArea())//200
console.log(s2.getArea())//1200

代码中，w 和 h 都是构造函数 Square 创建的对象实例，它们通过 prototype 继承了 getArea 方法。

1
2
3

(function(){
  console.log("hello world")
})();

function(){…} 是一个匿名函数，包围它的一对括号将其转换为一个表达式，紧跟其后的一对括号调用了这个函数。立即执行函数也可以理解为立即调用一个匿名函数。

立即执行函数最常见的应用场景就是：将 var 变量的作用域限制于函数内，这样可以避免命名冲突。

闭包(closure)：当外部函数返回之后，内部函数依然可以访问外部函数的变量。

1
2
3
4
5
6
7
8
9
10
11

function f1(){
  var a = 1; //a是f1的局部变量
  function f2(){//f2是函数f1的内部函数，是闭包
    a = a+1;//内部函数使用了f1中的变量a
    console.log(a);
  }
  return f2;
}
var test = f1();
test();//2
test();//3

代码中，外部函数 f1 只执行了一次，变量 a 设为 1 ，并将内部函数 f2 赋值给了变量 test 。由于外部函数 f1 已经执行完毕，其内部变量 a 应该在内存中被清除，然而事实并不是这样：我们每次调用 test 的时候，发现变量 a 一直在内存中，并且在累加。这就是闭包的神奇之处了！

使用闭包定义私有变量

1
2
3
4
5
6
7
8
9
10
11
12
13
14

function people(){
  var name;
  function getName(){
    return name;
  }
  function setName(value){
    name = value;
  }
}
var person = new people();
person.setName("张三");

console.log(person.name);//undefined
console.log(person.getName());//张三

代码中，对象 person 的的 name 属性为私有属性，使用 person.name 不能直接访问。

• 概述
• 装箱
• 拆箱
• 总结

概述

装箱：把基本数据类型转换为对应的引用类型的操作

拆箱：把引用类型转换为基本的数据类型

装箱

每当读取一个基本类型的时候，后台就会创建一个对应的基本包装类型对象，从而让我们能够调用一些方法来操作这些数据

1
2
3

var str1 = "hello world";
var str2 = str1.substring(7);
`

如上示例，str1是一个基本类型，js内部为我们做了装箱处理，使得它能使用方法.类似如下方式:

1
2
3

var str1 = new String("hello world");
var str2 = str1.substring(7);
str1 = null;

• 创建 String 类型的实例
• 调用实例方法
• 销毁实例

拆箱

将引用类型对象转换为对应的值类型对象，它是通过引用类型的valueOf()或者toString()方法来实现的。如果是自定义的对象，你也可以自定义它的valueOf()/tostring()方法，实现对这个对象的拆箱

1
2
3
4
5
6

//定义两个对象
var num = new Number(1314);  
var str =new String("1314");  

console.log(num) //1314
console.log(str) //"1314"

如上会自动调用valueOf()和toString实现拆箱

试一下

总结

装箱&拆箱逻辑并不复杂，但是要知道其中的原理，一旦涉及到底层api的时候才不会懵

• 概述
• 不使用undefined原因
• 使用void原因
• 其他一些替代写法
• reference

概述

undefined：表示未定义。

在编码中使用某一个变量或者函数之前有时会判断是否已经定义了，并且不是空然后再做处理。这个时候会使用比如：

1
2
3

if(a !== undefined && a! == null){
  .......
}

一般来讲是没有问题的，但如果经常阅读开源源码会发现，如下写法：

1
2
3

if(a !== void 0 && a! == null){
  .......
}

两种写法目的是一样的。

不使用undefined原因

上面提到两种写法，为什么建议用void 0 ？

主要原因是javascript在设计的时候undefined并不是一个关键字，也就是说如下代码是合理的不会报错:

1
2

var undefined = 100;
console.log(undefined)

不同的浏览器运行的结果不太相同，在chrome中仍然输出undifined，但是在比较老的IE中会输出100；

ES5之后undefined已经是一个只读属性，所以上述输出不同浏览器基本都是undefined。但是在局部作用域中undefined会被修改：

1
2
3
4

(function() {
  var undefined = 100;
  console.log(undefined);
})();

结果：输出100

试一下

使用void原因

void是javascript中的一个操作符，有两种写法

• void exp
• void(exp)

void：计算一个表达式但无论该表达式原来是否有自己的返回值，其返回值都为undefined

• 作用一：返回undefined，解决上面提到的undefined会被重新定义的问题
• 作用二：防止不必要的行为。比如a标签中我们有一种写法

  1	<a href="javascript:void(0)"></a>

因为void是关键字所以可以放心的用。为什么是void 0内，其实后面跟什么都会返回undefined，只是最简单的就是0这个字符，其实void 1，void 2，void(“hello”) 都可以。void 0可以做到占用字节数最少。

其他一些替代写法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

//取整
parseInt(a,10); //Before
Math.floor(a); //Before
a>>0; //Before
~~a; //After
a|0; //After
 
//四舍五入
Math.round(a); //Before
a+.5|0; //After
 
//内置值
undefined; //Before
void 0; //After, 快
0[0]; //After, 略慢
 
//内置值
Infinity;
1/0;
 
//布尔值短写法
true; //Before
!0; //After
 
//布尔值短写法
false; //Before
!1; //After

reference

https://blog.csdn.net/qq_33834489/article/details/81540018

• 区别
• 示例1-往数组添加元素
• 示例2-往数组中添加数组
• 效率

区别

功能：往数组末尾追加数据

push

• 会改变原有数组
• 如果添加一个数组，会把数组作为对象追加到末尾
• 如果添加一个数组并要解析，需要使用arr.push.apply()orArray.prototype.push.apply()

concat

• 不会改变原有数组，而是返回追加数据后的数组的副本，原有数组不变
• 如果添加一个数组，会把数组解析成元素逐个追加到末尾

示例1-往数组添加元素

push

1
2
3
4
5
6
7
8
9

var arr_src = new Array()
arr_src[0] = 1
arr_src[1] = 2
arr_src[2] = 3
arr_src[3] = 4
console.log(arr_src) //输出 [1,2,3,4]
var result = arr_src.push(5)
console.log(arr_src)  //输出[1,2,3,4,5]
console.log(result)   //输出5   即返回数组长度

运行结果

concat

1
2
3
4
5
6
7
8
9

var arr_src = new Array()
arr_src[0] = 1
arr_src[1] = 2
arr_src[2] = 3
arr_src[3] = 4
console.log(arr_src) //输出 [1,2,3,4]
var result = arr_src.concat(5)
console.log(arr_src)  //输出[1,2,3,4]
console.log(result)   //返回合并后的数组 输出[1,2,3,4,5]

运行结果

示例2-往数组中添加数组

push

1
2
3
4
5
6
7
8
9
10
11
12
13

var arr_src = new Array()
arr_src[0] = 1
arr_src[1] = 2
arr_src[2] = 3
arr_src[3] = 4
var arr_add = new Array()
arr_add[0] = 5
arr_add[1] = 6
console.log(arr_src) //输出 [1,2,3,4]
console.log(arr_add) //输出 [5,6]
arr_src.push(arr_add)
console.log(arr_src)  //输出[1,2,3,4,[5,6}]
console.log(arr_add)  //输出[5,6]

运行结果

如果要解析数组逐个追加可以使用apply,如下两种方法均可,arr_src数组会被改变，arr_add不变

1
2
3

arr_src.push.apply(arr_src,arr_add)        //[1, 2, 3, 4, 5,6]
//或者
Array.prototype.push.apply(arr_scr,arr_add)

尝试一下

concat

1
2
3
4
5
6
7
8
9

var arr_src = new Array()
arr_src[0] = 1
arr_src[1] = 2
arr_src[2] = 3
arr_src[3] = 4
console.log(arr_src) //输出 [1,2,3,4]
var result = arr_src.concat([5,6])
console.log(arr_src)  //输出[1,2,3,4]
console.log(result)   //输出[1,2,3,4,5,6]

运行结果

效率

测试环境

• 两个10万的数组合并
• chrome浏览器 Version 71.0.3578.98 (Official Build) (64-bit)

测试结果

• concat优与apply
• concat没有长度限制，apply在chrome浏览器下20万-30万之间就内存溢出，实际边界没有测试，不同浏览器不同

测试代码如下：保存为html用浏览器打开即可

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57

<!DOCTYPE html>
<head>
<script>
var testArray1=[]
var testArray2=[]
function reset(){
  var count = document.getElementById("count").value
  for(var i=0; i<count;i++){
    testArray1.push(i)
    testArray2.push(i+count)
  }
}
function setValue(id,value){
  document.getElementById(id).innerHTML = value
}
function testApply(){
  //初始化数组
  reset()
  var startTime=0
  var endTime=0
  console.log('开始：'+ (startTime=new Date().getTime()))
  setValue("startTime",startTime)
  var result=Array.prototype.push.apply(testArray1,testArray2) // result为合并后的数组长度
  console.log(result)
  console.log('结束：'+ (endTime=new Date().getTime()))
  setValue("endTime",endTime)
  console.log('耗时：'+(endTime-startTime))
  setValue("totalTime",endTime-startTime)
}
function testConcat(){
  //初始化数组
  reset()
  var startTime=0
  var endTime=0
  console.log('开始：'+ (startTime=new Date().getTime()))
  setValue("startTime",startTime)
  var result=testArray1.concat(testArray2) //result为合并后的数组
  console.log(result.length)
  console.log('结束：'+ (endTime=new Date().getTime()))
  setValue("endTime",endTime)
  console.log('耗时：'+(endTime-startTime))
  setValue("totalTime",endTime-startTime)
}
</script>
</head>
<body>
  <input type="text" id="count" />
  <button onclick="testApply()">testApply</button>
  <button onclick="testConcat()">testConcat</button>
  <br>
  <ul>
    <li>开始:<div id="startTime"></div></li>
    <li>结束:<div id="endTime"></div></li>
    <li>耗时:<div id="totalTime"></div>毫秒</li>
  </ul>
</body>
</html>

效果图：

世界上的开源许可证，大概有上百种。很少有人搞得清楚它们的区别。即使在最流行的六种

GPL
BSD
MIT
Mozilla
Apache
LGPL

之中做选择，也很复杂。

乌克兰程序员Paul Bagwell，画了一张分析图

阮一峰对该图做了翻译

以下也收集了网上几张经典的开源协议图

开源协议英文版-Paul Bagwell

开源协议中文版-阮一峰翻译版

开源协议中文版-网络

开源协议英文版-网络

reference

http://www.ruanyifeng.com/blog/2011/05/how_to_choose_free_software_licenses.html

(待)2019 年值得学习的顶级 JavaScript 框架与主题

(待)从输入URL到页面加载的过程？如何由一道题完善自己的前端知识体系！

(待)Tasks, microtasks, queues and schedules

2018年JavaScript生态圈调查报告出炉！

GitHub年度盘点：Deno赶超Node，跃升第四！

Navicat连接本地数据库报错

1

navicat for mysql[Mac]解决Can't connect to MySQL server on '127.0.0.1'(61 "Connection refused")

处理过程

网上找了很多方法都没有解决，应该是场景不一样。

步骤一：查看mysql服务是否启动（发现没有启动）

步骤二：启动mysql服务（启动报错）

执行命令

1

sudo /usr/local/mysql/support-files/mysql.server start

启动过程报错

1

ERROR! The server quit without updating PID file (/usr/local/mysql/data/bogon.pid).

步骤三：处理启动mysql服务报错问题

同样的网上找了很多问题也没发现原因，无意间点开mac上的mysql控制面板

看到一条很有用的信息

1

“Warning:The /usr/local/mysql/data directory is not owned by the 'mysql' or '_mysql' ”

修改权限

1
2

sudo chown -R mysql /usr/local/mysql/data
sudo /usr/local/mysql/support-files/mysql.server start

启动正常

步骤四：再次使用Navicat连接（成功）

补充

停止MySQL服务

1

sudo /usr/local/mysql/support-files/mysql.server stop

重启MySQL服务

1

sudo /usr/local/mysql/support-files/mysql.server restart

与学习框架相比，这些基础知识保值率更高，框架更新更替很快，但是基础知识不会，尤其是一些思想，设计模型等。

可以通过本人购买后分享的二维码购买，这样有回馈，也可以直接去极客app内购买

后端或者说服务端渲染页面并输出

直白的说在服务端获取页面需要的数据根据模板生成html页面并输出。现在服务端渲染通常使用nodejs处理。

nodejs端有很多优秀的框架 如：express ，koajs，egg

同构

前端和直出端使用同样的代码方案。比如：vue的nuxt ，react的next

同比

与历史同时期比较

比如：2019年1月与2018年一月相比

环比

表示连续2个单位周期（比如连续两月）内的量的变化比

比如：2018年12月与2018年11月相比

注

同比和环比，这两者所反映的虽然都是变化速度，但由于采用基期的不同，其反映的内涵是完全不同的；一般来说，环比可以与环比相比较，而不能拿同比与环比相比较；而对于同一个地方，考虑时间纵向上发展趋势的反映，则往往要把同比与环比放在一起进行对照