前端面试重点:CSS重绘与回流、函数与变量区别解析

5星 · 超过95%的资源 需积分: 0 1 下载量 182 浏览量 更新于2024-08-28 收藏 2KB TXT 举报
"这部分内容包含了前端面试中常见的一些知识点,包括CSS的重绘与回流的概念及优化策略,箭头函数与普通函数的区别,以及JavaScript中的let、var、const声明变量的区别,还有如何实现`new`操作符的伪代码解释,最后提到了原型链和原型在JavaScript继承中的作用。" 在前端开发中,理解CSS的重绘和回流至关重要,因为它们直接影响页面性能。重绘是指元素外观的改变,如颜色、背景色等,不会影响布局,但会触发浏览器重新绘制元素。回流则更为复杂,涉及元素尺寸或位置的改变,这会导致浏览器重新计算元素及其子孙元素的几何信息,影响整个布局。优化策略包括使用CSS3的`translate`代替位置改变,避免频繁操作样式属性,以及利用类(class)而非内联样式。 箭头函数和普通函数在JavaScript中的`this`指向上有显著差异。普通函数的`this`取决于调用方式,可能是全局对象(在非严格模式下是`window`)、构造函数、`call`、`apply`或`bind`指定的对象。而箭头函数没有自己的`this`,它会捕获其所在(词法)上下文的`this`值。此外,箭头函数不能作为构造函数,不能使用`arguments`对象,也不能使用`yield`命令。 在JavaScript中,`var`、`let`和`const`用于声明变量,各有特点。`var`有全局作用域或函数作用域,存在变量提升,允许重复声明。`let`引入了块级作用域,不支持变量提升,有暂时性死区,不允许在同一作用域内重复声明。`const`同样有块级作用域,不允许重复声明,但声明的变量一旦赋值后不可变,试图修改会抛出错误,但注意,如果声明的是对象,对象的属性是可以修改的。 在JavaScript的继承机制中,`new`操作符起着关键作用。这里的伪代码展示了`new`的工作原理:创建新对象,设置新对象的`__proto__`指向构造函数的`prototype`,然后在新对象上执行构造函数,最后返回新对象。如果构造函数返回了一个对象,那么这个对象将替换新创建的对象,否则返回新对象。 原型链是由`__proto__`属性构成的链式结构,允许对象通过原型查找属性,即使自身没有该属性,也能沿着原型链向上查找。每个对象都有`__proto__`,它指向了构造该对象的构造函数的`prototype`属性,形成了一个链条,使得原型链上的方法和属性可以被所有对象共享。原型也是JavaScript实现继承的一种方式,通过将一个对象设置为另一个对象的原型,可以实现属性和方法的继承。