React进阶之路书籍笔记

React进阶之路:

1. "于复合类型的变量，变量名不指向数据，而是指向数据所在的地址。const命令只是保证变量名指向的地址不变，并不保证该地址的数据不变，所以将一个对象声明为常量必须非常小心。" (标注: const只是指向地址。对于有引用数据 例如 对象)

2. 常量a是一个数组，这个数组本身是可写的，但如果将另一个数组赋值给a，就会报错。"

(标注: const1声明常量 不能修改 2；引用常量 指向引用内存；引用内存的值是可以修改的，但是不能对引用地址重新赋值)

1. 上面的代码在代码块中分别用let和var声明了两个变量。然后在代码块之外调用这两个变量，结果let声明的变量报错，var声明的变量返回了正确的值。这表明，let声明的变量只在其所在代码块有"

2. " for循环的计数器，就很适合使用let命令。

 for(let i = 0; i < 10; i++){
   console.log(i)     //correct
 }
 console.log(i)      //error 错误 let 适合在代码块中使用  可以改用var

//ReferenceError 以上代码中的计数器i，只在for循环体内有效。 下面的代码如果使用var，最后将输出10"

"上面的代码中，由于typeof运行时x尚未声明，所以会抛出一个ReferenceError。"

"之，在代码块内，使用let命令声明变量之前，该变量都是不可用的。这在语法上称为“暂时性死区”（temporal dead zone，简称TDZ）。 "

1. "const用来声明常量。一旦声明，其值就不能改变。

   const PI = 3.1415; PI // 3.1415 PI = 3; // TypeError: "PI" is read-only  ，const一旦声明常量，就必须立即初始化，不能留到以后赋值
   const foo          // SyntaxError: missing = in const declaration
   

"面的代码中，常量foo储存的是一个地址，指向一个对象。不可变的只是这个地址，即不能把foo指向另一个地址，但对象本身是可变的，所以依然可以为其添加新属性。"

"const a = []; a.push("Hello"); // 可执行 a.length = 0; // 可执行 a = ["Dave"];"

1. "果真的想将对象冻结，应该使用Object.freeze方法。 const foo = Object.freeze({}); foo.prop = 123; // 不起作用 上面的代码中，常量foo指向一个冻结的对象，所以添加新属性不起作用。 "

​ "从数组和对象中提取值，对变量进行赋值，这被称为解构（Destructuring）。 "

"果箭头函数不需要参数或需要多个参数，就使用圆括号代表参数部分。

1. 箭头函数

   var f = () => {
    	 5
   }
    // 等同于 var f = function (){ return 5 };   ()中传参数  {}中写代码块
   
    var sum = (num1, num2) => num1 + num2; // 等同于
    var sum = function(num1, num2) {
     	return num1 + num2;
    };
   

"var sum = (num1, num2) => { return num1 + num2; } 由于大括号被解释为代码块，所以如果箭头函数直接返回一个对象，必须在对象外面加上括号。 var getTempItem = id => ({ id: id, name: "Temp" });"

"．函数体内的this对象就是定义时所在的对象，而不是使用时所在的对象。"

"一点尤其值得注意。this对象的指向是可变的，但在箭头函数中它是固定的。"

"果是普通函数，执行时this应该指向全局对象，但是箭头函数导致this总是指向函数所在的对象。"

  var handler = {
  id: "123456", init: function () {
    document.addEventListener("click", event => this.doSomething(event.type), false);
  },
  doSomething: function (type) { console.log("Handling " + type + " for " + this.id); }
};

"上面的init方法中使用了箭头函数，这导致this总是指向handler对象。否则，回调函数运行时，this.doSomething这一行会报错，因为此时this指向全局对象。"

"this指向的固定化，并不是因为箭头函数内部有绑定this的机制，实际原因是箭头函数根本没有自己的this，导致内部的this就是外层代码块的this。正因为它没有this，所以也就不能用作构造函数。"

"以下3个变量在箭头函数中也是不存在的，分别指向外层函数的对应变量：arguments、super和new.target。 "

"头函数“绑定”this，很大程度上解决了这个困扰。"

"const plus1 = a => a + 1; const mult2 = a => a * 2; mult2(plus1(5)) // 12 箭头函数还有一个功能，就是可以很方便地改写λ演算。"

"数绑定运算符是并排的双冒号（::），双冒号左边是一个对象，右边是一个函数。该运算符会自动将左边的对象作为上下文环境（即this对象）绑定到右边的函数上。"

"指某个函数的最后一步是调用另一个函数。"

"面的代码中，情况一是调用函数g之后还有赋值操作，所以不属于尾调用，即使语义完全一样；情况二也属于调用后还有操作，即使写在一行内；情况"

"况三等同于下面的代码。 function f(x){ g(x); return undefined; }"

1. es5语法 map遍历

    var a = [1,2]
   	a.map((index,i)=>{   //index 索引 从0开始,i  map中包含的值
         console.log("ssss",i,index)    //ssss 0 1  ssss 1 2
       })
   

   ​