2019年第18周web前端项目学习

更新node 版本和 npm 版本

npm 和node版本更新

#####  npm 版本更新

查看当前版本：npm -v

更新npm版本：npm install -g npm

项目问题

node 版本更新

下载你想要的版本或者最新的版本，node.js官网下载
下载完成后点击安装，傻瓜式安装，什么都不用变；
安装完成，输入 node -v 查看当前安装版本

更新node.js后项目文件启动报错；

Module build failed: Error: Missing binding D:\项目文件\天津中审联项目\天津中审联管理系统\中审联5.1期\tjzsl5.1\node_modules\_node-sass@4.11.0@node-sass\vendor\win32-x64-64\binding.node
Node Sass could not find a binding for your current environment: Windows 64-bit with Node.js 10.x

Found bindings for the following environments:
- Windows 64-bit with Node.js 8.x

解决办法：删除文件的下载依赖文件node_modules夹，重新下载依赖；npm install

csessionStorage 和 localStorage 的作用和区别：

localStorage的生命周期是永久的，关闭页面或浏览器之后localStorage中的数据也不会消失。localStorage除非主动删除数据，否则数据永远不会消失。

sessionStorage的生命周期是在仅在当前会话下有效。sessionStorage引入了一个“浏览器窗口”的概念，sessionStorage是在同源的窗口中始终存在的数据。只要这个浏览器窗口没有关闭，即使刷新页面或者进入同源另一个页面，数据依然存在。但是sessionStorage在关闭了浏览器窗口后就会被销毁。同时独立的打开同一个窗口同一个页面，sessionStorage也是不一样的。

相同浏览器的不同页面间可以共享相同的 localStorage（页面属于相同域名和端口），但是不同页面或标签页间无法共享sessionStorage的信息。这里需要注意的是，页面及标 签页仅指顶级窗口，如果一个标签页包含多个iframe标签且他们属于同源页面，那么他们之间是可以共享sessionStorage的。

css

position的选项

position属性指定一个元素（静态的，相对的，绝对或固定）的定位方法的类型。

absolute	
生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位。
元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。

fixed	
生成固定定位的元素，相对于浏览器窗口进行定位。
元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。

relative	
生成相对定位的元素，相对于其正常位置进行定位。
因此，"left:20" 会向元素的 LEFT 位置添加 20 像素。

static	
默认值。没有定位，元素出现在正常的流中（忽略 top, bottom, left, right 或者 z-index 声明）。

sticky	
粘性定位，该定位基于用户滚动的位置。
它的行为就像 position:relative; 而当页面滚动超出目标区域时，它的表现就像 position:fixed;，它会固定在目标位置。
注意: Internet Explorer, Edge 15 及更早 IE 版本不支持 sticky 定位。 Safari 需要使用 -webkit- prefix (查看以下实例)。

inherit	
规定应该从父元素继承 position 属性的值。

initial	
设置该属性为默认值，详情查看 CSS initial 关键字。

js

replace()方法

replace() 方法用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。

stringObject.replace(regexp/substr,replacement)

regexp/substr	
必需。规定子字符串或要替换的模式的 RegExp 对象。
请注意，如果该值是一个字符串，则将它作为要检索的直接量文本模式，而不是首先被转换为 RegExp 对象。

replacement	
必需。一个字符串值。规定了替换文本或生成替换文本的函数。

for循环终结

break和continue都是用来控制循环结构的终止；

break:

有时候出现某种条件时我们需要终止循环，而不是等到循环条件循环完才终止，这个时候我们可以使用break;
break用于完全结束一个循环，跳出循环体执行循环体后面的语句

continue:

continue是终止本次循环体里面的操作，还要接着执行后面的循环
continue是跳过本次循环中剩下的语句，继续下一循环

正则复习

预定义类：

• .[^\n\r]:除了换行和回车之外的任意字符；
• \d(digit)[0~9]:数字字符
• \D[^0~9]:非数字字符
• \s[\f\r\n\t\v]:不可见字符 空白字符
• \S[^\f\r\n\t\v]:可见字符
• \w[a-zA-Z0-9]:单词字符（所有的字母数字和——）
• \W[^a-zA-Z0-9]:非单词字符

基本语法补充：

• | 表示或，或的优先级最低
• () 表示提升优先级

检测方法：test()

正则对象的检测方法，检查字符串是否符合该规则，返回true和false

字符类：

• 简单类：[] 整体对应一个字符，里面的内容表示该位置可以有哪些字符
• 负向类：^ 括号内，前面加字符 ^ 进行取反。表示匹配不能为括号里面的字符
• 范围类：- 有时匹配的东西过多，而且类型又相同，可以在中间加上横线
• 组合类：[a-m1-5] 用括号匹配不同类型的单个字符

边界：

• ^ 会匹配行或者字符串的起始位置
• $ 会匹配行或者字符串的结束位置
• ^$会一起表示必须是这个

量词：

• *表示零次或更多X>=0;
• +表示一次或更多X>=1;
• ?表示零次或者一次X=(0||1)
• {n} n次x=n
• {n,}重复n次或更多X>=n
• {n,m}重复出现的次数比n多比m少 n<=x<=m

括号总结：

• {}表示次数
• []表示一个字符的位置
• ()表示一组