正则匹配URL、块级元素和内联（行内）元素区别、ES6新增、H5新增

正则匹配url

正则以 ^为开始符，使用//进行包裹内容，url包括协议部分http(s)://；域名部分baidu.；顶级域名com,cn;端口部分:20;请求路径/login;问号传参及哈希值：?age=1;结束符$

实现过程

const _isUrl=url=>{

let reg=/^((http|https|ftp)?:\/\/)(([A-Za-z0-9]+-[A-Za-z0-9]+|[A-Za-z0-9]+)\.)+([A-Za-z]{2,6})(:/d+)?(\/.*)?(\?.*)?(#.*)$/

return reg.test(url)

}

 

块级元素与内联元素区别

块级元素独占一行，内联元素可在一行内使用多个；

块级元素可以设置宽高、内外边距，内联元素无法设置宽高，但是可以设置左右内外边距；

常用的块级元素有div、p、ul、ol、li、h1-h6,hr分割线等；常用的内联元素有span、img、a、br换行等

 

H5新特性

1.语义化标签：头部header、导航nav、侧边栏aside、内容区域section、独立内容article、底部footer

2.表单控件：网络地址url、邮箱email、搜索search、时间date、日历格式calendar

3.音频标签audio、视频标签video

4.webStorage：新的存储机制，为本地存储，可以支持跨会话、持久化、大量化存储数据。

 

！DOCTYPE：

作用：告知浏览器采用哪种hmtl规范或者xhtml规范解析页面

原因：在W3C之前，不同的浏览器渲染页面都有不同的标准，这就是混杂模式，是宽松的向后兼容的方式；W3C规定了一个标准，使浏览器严格按照其标准进行渲染，这就是严格模式，也叫标准模式。如果此标签不存在，那么浏览器将以混杂模式进行渲染。

 

ES6新特性：

1.let和const声明变量与常量，都有块级作用域，不会出现变量提升的情况

2.map结构，新的数据结构，键值类型，支持任意类型的键值对

3.箭头函数，不再使用function关键字，改用()=>，但是箭头函数不可使用arguments对象，无法构造对象

4.模板字符串，使用反引号``进行包裹，有简单的字符串插值功能，可定义多行字符串

如：`这是一个叫${name}的人`

5.解构赋值，ES5允许按照一定的规则解构出数组和对象里的值对变量进行赋值

如：let [a,b,c,d,e]=[1,2,3,4] 

a=1,b=2,c=3,d=4,e=undefined

6.for(...of...)循环，可以遍历循环数组、set、map结构或者类似数组的对象、字符串

如：

function sum() {

    let sum = 0

    for (num of arguments) {

        sum += num

    }

    console.log(sum);

}

sum(1, 2, 3, 4)

7.import导入模块、export暴露模块

8.set结构，类似数组，但是它的元素不允许重复

9.基本数据类型symbol，通过调用symbol函数获取，它的返回值是唯一的

10，promise，一种异步编程解决方案，有三种状态padding进行中、resolve解析、reject拒绝，使用.then()调用成功和失败的回调