记录一些常见的javascript问题

在日常开发中，js总是有一些让人出人意料的惊喜，今天终于下定决心，把他们都记录下来，希望大家都能够避免他们

运算类型

概念问题

1. 在一个函数中，return后的代码就不执行了吗？

   function aa(x) {
       var c = null
       function cb() {
           console.log('cb')
           console.log(c)
       }
       try {
           c = x + 2;
           return c
       } finally {
           c++
           cb()
       }
   }
   

   控制台最终打印结果为

   cb
   5
   4

   可见 当函数return是 return的值不再受后面的影响，但后面函数依然会执行。当返回的是一个引用类型时，若在cb中修改了值，则return中的结果也会受到影响

2. const定义的常量不能改变？
   这是一个经常容易混淆的概念,const 是ES6提供的一种新的变量声明方式,下面是阮大大在ECMAScript 6 入门中对const做的解释。

   const声明一个只读的常量。一旦声明，常量的值就不能改变。
   const实际上保证的，并不是变量的值不得改动，而是变量指向的那个内存地址所保存的数据不得改动。

   所以我们可以看出

   1. 如果是值类型，值不可变
   2. 如果是引用类型，地址不可变

3. React 中 setState 是异步还是同步？
   这个问题之前自己一直理解得有些模糊，只是在需要在取值时，在setState的回调中进行，已经传递一个函数。
   首先setState 有两种用法，一个传递对象，一种传递一个函数，函数中有更新后的state，和props两个对象。
   一般在React事件函数和钩子函数中，setState 都表现为异步，主要目的是为了优化性能，将多个setState归结为一次重新渲染。然后在原生事件以及setTimeout这种异步事件中，setState 又表现为同步，代码如下：

   constructor(props: IObjectAny) {
   	super(props);
   	this.state = {
    	editLoading: false,
   	};
    }
   componentDidMount() {
   	 setTimeout(() => {
     		console.log(this.state.editLoading)     // false
     		this.setState({
       		editLoading: true
    	 	})
    		 console.log(this.state.editLoading)   // true
   	 }, 50)
    }
   

   可见 在setTimeout中 setState表现为同步。

4. css动画，修改margin-left值好 还是修改transform好？

   • 修改margin-left会引起页面回流(reflow)，transform只会引起重绘(repaint)
   • transform能开启gpu加速