页面布局
假设高度已知,请写出三栏布局,其中左栏,右栏宽度各为300,中间自适应
- 绝对定位
- 浮动
- flex布局: display: flex
- table布局: display: table-cell
- grid布局: display: grid
css盒模型
css盒模型的基本概念
content, padding, border, margin
标准模型, 宽高是content
IE模型, 宽高是content+padding+border
css如何设置这两种模型
css如何设置这两种模型
box-sizing: content-box; // 设置标准模型,默认
box-sizing: border-box; // 设置IE模型
js如何设置盒模型对应的宽高
js如何设置盒模型对应的宽高
dom.style.width/height // 只能取到dom节点的内联样式的宽和高
dom.currentStyle.width/height //可以拿到渲染以后的宽和高,但只有IE支持
window.getComputedStyle(dom).width/height //可以拿到渲染以后的宽和高
dom.getBoundingClientRect().width/height //可以拿到相对于视窗的left,top,width,height
根据和模型解释边距重叠
根据和模型解释边距重叠
<div id="parent">
<div id="son" style="height: 100px;margin-top: 10px;"></div>
</div>
计算父级的实际高度
110px,100px都行,要看父级模型的设置
'边距重叠解决方案BFC,'
dom事件
类型转换 http协议 原型链 面向对象 通信 安全类
数据类型
JavaScript 的数据类型有下列 8 种: undefined,Null,Boolean,String,Number,Symbol,Bigint,Object
其中前 7 种类型为基础类型,最后一种 Object 为引用类型
而 Object 又分为这几种常见的类型: 数组对象(Array), 正则对象(RegExp), 日期对象(Date), 数学函数(Math), 函数对象(Function)
值 null 是一个字面量,不像 undefined,它不是全局对象的一个属性。null 是表示缺少的标识,指示变量未指向任何对象。把 null 作为尚未创建的对象,也许更好理解。在 API 中,null 常在返回类型应是一个对象,但没有关联的值的地方使用。
数据类型检测的检测方法通常由type of, instance of和Object原型对象上的toString方法
typeof在判断基础数据类型和function类型时表现很好,但由于历史原因它将null判断为object而不是null
Object原型对象上的toString方法对检测不同object类型时很好用
强制类型转换
强制类型转换方式包括 Number()、parseInt()、parseFloat()、toString()、String()、Boolean()
Number() 方法的强制转换规则
- 如果是布尔值,true 和 false 分别被转换为 1 和 0;
- 如果是数字,返回自身;
- 如果是 null,返回 0;
- 如果是 undefined,返回 NaN;
- 如果是字符串,遵循以下规则:如果字符串中只包含数字(或者是 0X / 0x 开头的十六进制数字字符串,允许包含正负号),则将其转换为十进制;如果字符串中包含有效的浮点格式,将其转换为浮点数值;如果是空字符串,将其转换为 0;如果不是以上格式的字符串,均返回 NaN;
- 如果是 Symbol,抛出错误;
- 如果是对象,并且部署了 [Symbol.toPrimitive] ,那么调用此方法,否则调用对象的 valueOf() 方法,然后依据前面的规则转换返回的值;如果转换的结果是 NaN ,则调用对象的 toString() 方法,再次依照前面的顺序转换返回对应的值。
Boolean() 方法的强制转换规则
这个方法的规则是:除了 undefined、 null、 false、 空字符串、 0(包括 正0,负0)、 NaN 转换出来是 false,其他都是 true。
隐式类型转换
凡是通过逻辑运算符 (&&、 ||、 !)、运算符 (+、-、*、/) 关系操作符 (>、 <、 <= 、>=)、相等运算符 (==) 或者 if/while 条件的操作,如果遇到两个数据类型不一样的情况,都会出现隐式类型转换。
将类数组转换为数组的方法
Array.prototype.slice.call()
Array.from()
作用域
作用域通俗来讲,就是指变量能够被访问到的范围
ES5 之前只有全局作用域和函数作用域两种
ES6 出现之后,又新增了块级作用域