从“零”开始的前端面试笔记（一）

模块化：代码角度，把一些可复用的代码，抽离为单个的模块；便于项目的维护与开发；
组件化：UI界面角度，把一些可复用的UI元素，抽离为单独的组件；便于项目的维护和开发；

React如何实现组件化？
React中，组件(结构、行为、样式)都是以JS来表示的

DOM(Document Object Model)
浏览器中的概念，用JS对象来表示页面上的元素，并提供了操作DOM的API;

虚拟DOM（Virtual Document Object Model）
是框架中的概念，用JS对象来模拟页面上的DOM和DOM嵌套；

为什么要实现虚拟DOM：为了实现页面中，DOM元素的高效更新；

网页呈现过程：
1. 浏览器请求服务器获取HTML代码；
2.浏览器先在内存中解析DOM结构，并在浏览器内存中，渲染出一棵DOM树；
3.浏览器吧DOM树呈现到页面上；

为普通样式表启用模块化
webpack.config.js
{test:/\.css$/, use: ['style-loader', 'css-loader?modules']}

css模块化只针对类选择器和Id选择器生效
·demo.css·

.title{
    color: red;
}

#cmtTitle{
    font-size: 14px;
}

//不生效
h1{
    font-style: italic;
}

//不会被模块化，全局生效
:global(.test){
    font-style: italic;
}