javascript状态容器是什么,怎么理解

一、javascript状态容器是什么,怎么理解

1、Redux要解决什么问题？

随着 JavaScript单页应用开发日趋复杂，JavaScript需要管理比任何时候都要多的 state（状态）。这些 state可能包括服务器响应、缓存数据、本地生成尚未持久化到服务器的数据，也包括 UI状态，如激活的路由，被选中的标签，是否显示加载动效或者分页器等等。

2、随着 JavaScript单页应用开发日趋复杂，JavaScript需要管理比任何时候都要多的 state（状态）。这些 state可能包括服务器响应、缓存数据、本地生成尚未持久化到服务器的数据，也包括 UI状态，如激活的路由，被选中的标签，是否显示加载动效或者分页器等等。

3、管理不断变化的 state非常困难。如果一个 model的变化会引起另一个 model变化，那么当 view变化时，就可能引起对应 model以及另一个 model的变化，依次地，可能会引起另一个 view的变化。直至你搞不清楚到底发生了什么。state在什么时候，由于什么原因，如何变化已然不受控制。当系统变得错综复杂的时候，想重现问题或者添加新功能就会变得举步维艰。

4、Redux的设计借鉴Flux、Elm、Immutable，它的出现就是为了解决state里的数据问题。Redux和Flux的主要区别是Redux里面是单一的数据源设计，而Flux（或者Reflux）里面有多个数据源。

5、我们知道，在React中，数据在组件中是单向流动的。数据从一个方向父组件流向子组件(通过props)，由于这个特征，两个非父子关系的组件（或者称作兄弟组件）之间的通信并不是那么清楚。

6、React并不建议直接采用组件到组件的通信方式，尽管它有一些特性可以支持这么做(比如先将子组件的值传递给父组件，然后再由父组件在分发给指定的子组件)。这被很多人认为是糟糕的实践方式，因为这样的方式容易出错而且会让代码向“拉面”一样不容易理解。

7、当然React也没有直接建议如何去处理这种情形，以下是React的文档中关于这部分的描述：

8、对于非父子关系的组件，你可以自己建立一个全局的事件系统，Flux的模式也是一种可行的方式。

9、Redux的出现就让这个问题的解决变得更加方便了。Redux提供一种存储整个应用状态到一个地方的解决方案（可以理解为统一状态层），称为“store”，组件将状态的变化转发通知(dispatch)给store，而不是直接通知其它的组件。组件内部依赖的state的变化情况可以通过订阅store来实现。

10、使用Redux，所有的组件都从store里面获取它们依赖的state，同时也需要将state的变化告知store。组件不需要关注在这个store里面其它组件的state的变化情况，Redux让数据流变得更加简单。这种思想最初来自Flux，它是一种和React相同的单向数据流的设计模式。

二、javascript中: (function(){})();如何理解

1、javascript中:(function(){})()是匿名函数，主要利用函数内的变量作用域，避免产生全局变量，影响整体页面环境，增加代码的兼容性。

2、(function(){})是一个标准的函数定义，但是没有复制给任何变量。所以是没有名字的函数，叫匿名函数。没有名字就无法像普通函数那样随时随地调用了，所以在他定义完成后就马上调用他，后面的括号()是运行这个函数的意思

3、函数声明：使用function声明函数，并指定函数名。

4、函数表达式：使用function声明函数，但未指定函数名，将匿名函数赋予一个变量。

5、var setFn= function(){// coding}

6、匿名函数：使用function关键字声明函数，但未指定函数名。匿名函数属于函数表达式，匿名函数有很多作用，赋予一个变量则创建函数，赋予一个事件则成为事件处理程序或创建闭包等等。

7、参考资料：百度百科- javascript

三、javascript中div和span的区别

div和span的最主要区别在于语义上，默认情况下：

<div>是用于组合其他 HTML元素的容器，即下级可以嵌套其他HTML元素。基于此特征，<div>属于块级元素，浏览器会在其前后显示换行。

<span>是文本的容器，即一般只包围在文本的两边。基于此特征，<span>属于内联元素，即在显示时通常不会以新行开始。

1、假设有如下的HTML元素，并且为div和span设置了边框，便于观察效果

<span>我是span元素的内容1</span><span>我是span元素的内容2</span>

<div>我是div元素的内容1</div><div>我是div元素的内容2</div>

2、结果如下，显示了<div>属于块级元素及<span>属于内联元素的特点。

2、结果如下，显示了<div>属于块级元素及<span>属于内联元素的特点。