Web前端最全JS基础22，高级前端开发工程师面试题

JavaScript

• js的基本类型有哪些？引用类型有哪些？null和undefined的区别。

• 如何判断一个变量是Array类型？如何判断一个变量是Number类型？（都不止一种）

• Object是引用类型嘛？引用类型和基本类型有什么区别？哪个是存在堆哪一个是存在栈上面的？

• JS常见的dom操作api

• 解释一下事件冒泡和事件捕获

• 事件委托（手写例子），事件冒泡和捕获，如何阻止冒泡？如何组织默认事件？

• 对闭包的理解？什么时候构成闭包？闭包的实现方法？闭包的优缺点？

• this有哪些使用场景？跟C,Java中的this有什么区别？如何改变this的值？

• call，apply，bind

• 显示原型和隐式原型，手绘原型链，原型链是什么？为什么要有原型链

• 创建对象的多种方式

• 实现继承的多种方式和优缺点

• new 一个对象具体做了什么

• 手写Ajax，XMLHttpRequest

• 变量提升

• 举例说明一个匿名函数的典型用例

• 指出JS的宿主对象和原生对象的区别，为什么扩展JS内置对象不是好的做法？有哪些内置对象和内置函数？

• attribute和property的区别

• document load和document DOMContentLoaded两个事件的区别

• JS代码调试

• 开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

  

//**表示监控下面的所有文件

打包操作

---

1. 打包CSS文件

• 下载三方工具npm i -D gulp-cssmin

• 引入const cssmin=require(‘cssmin’)

• 执行代码

gulp.task(‘css’,function(){

return gulp.src(‘./src/css/**’).pipe(cssmin()).pipe(gulp.dest(‘./dist/css’))

})

//终端输入gulp css执行

2. 打包sass文件

• 下载三方工具npm i -D gulp-sass && npm i sass

• 引入const sass=require(‘gulp-sass’)(require(‘sass’))

• 执行代码

gulp.task(‘sass’,function(){

return gulp.src(‘./src/sass/**’).pipe(sass()).pipe(cssmin()).pipe(gulp.dest(‘./dist/css’))

})

//终端输入gulp sass执行

3. 压缩JS文件

• 下载三方工具npm i -D gulp-uglify

• 引入const uglify=require(‘gulp-uglify’)

• 执行代码

gulp.task(‘js’,function(){

return gulp.src(‘./src/js/**’).pipe(uglify()).pipe(gulp.dest(‘./dist/js’))

})

//终端输入gulp js执行

4. 打包HTML文件

• 下载三方工具npm i -D gulp-htmlmin

• 引入const htmlmin=require(‘htmlmin’)

• 执行代码

gulp.task(‘html’,function(){

return gulp.src(‘./src/pages/**’).pipe(htmlmin({removeEmptyAttibutes:true,collapseWhitespace:true})).pipe(gulp.dest(‘./dist.pages’))

})

//终端输入gulp html执行

5. 处理lib和static这些只需要copy过去就行

6. 当要执行命令过多时，我们可以集成下

exports.default=gulp.parallel(‘css’,‘sass’,‘js’,‘html’)

//通过exports将默认对象暴露出区，现在在终端只需执行gulp

7. 清除DIST文件夹

• 在编译时候，如果dist文件夹中已经有了这个文件还是会从再编译一个文件，为了避免这个问题我们可以先删除再编译

• 下载三方工具npm i -D gulp-clean

• 引入const clean=require(‘clean’)

• 执行命令

gulp.task(‘clean’,function(){

return gulp.src(‘./dist’,{allowEmpty:true}).pipe(clean())

//allowEmpty表示在dist不在时也可执行，不会报错

})

//终端执行gulp clean删除dist文件夹

8. 自动打开浏览器，在编译完成后自动打开浏览器

• 下载npm i -D gulp-webserver

• 导入const webserver=require(‘gulp-webserver’)

• 执行代码

gulp.task(‘webserver’,function(){

return gulb.src(‘./dist’).pipe(webserver({

host:‘localhost’,//配置打开浏览器域名

port:3000,//配置浏览器打开端口

livereload:true,//自动刷新浏览器

open:‘./pages/index.html’//默认打开dist文件夹下那个文件

}))

})

9. 安装包参数

• npm install -S sass 线上环境依赖

• npm install -D sass 开发dev环境依赖

GULP代码

---

const gulp = require(‘gulp’)

const cssmin = require(‘gulp-cssmin’)

const sass = require(‘gulp-sass’)(require(‘sass’));

// 3-1. 引入 gulp-uglify

const uglify = require(‘gulp-uglify’)

// 3-2. 引入 gulp-babel

// es6 转 es5 虽然需要下载三个依赖，但是只需要引入一个 gulp-babel 就可以了

const babel = require(‘gulp-babel’)

// 4. 引入 gulp-htmlmin

const htmlmin = require(‘gulp-htmlmin’)

// 5. 引入 gulp-clean

const clean = require(‘gulp-clean’);

// 7. 引入 gulp-webserver

const webserver = require(‘gulp-webserver’)

gulp.task(‘css’, function () {

return gulp.src(‘./src/css/**’)

.pipe(cssmin())

.pipe(gulp.dest(‘./dist/css’))

})

gulp.task(‘sass’, function () {

return gulp.src(‘./src/sass/**’)

.pipe(sass())

.pipe(cssmin())

.pipe(gulp.dest(‘./dist/css’))

})

// 3. 创建一个 js 任务

gulp.task(‘js’, function () {

return gulp

.src(‘./src/js/**’)

.pipe(babel({

presets: [‘es2015’]

}))

.pipe(uglify())

.pipe(gulp.dest(‘./dist/js’))

})

// 4. 创建一个 html 任务

gulp.task(‘html’, function () {

return gulp

.src(‘./src/pages/**’)

.pipe(htmlmin({

removeEmptyAttibutes: true, // 移出所有空属性

collapseWhitespace: true // 压缩 html

}))

.pipe(gulp.dest(‘./dist/pages’))

})

gulp.task(‘lib’, function () {

return gulp.src(‘./src/lib/**’)

.pipe(gulp.dest(‘./dist/lib’))

})

gulp.task(‘static’, function () {

return gulp.src(‘./src/static/**’)

.pipe(gulp.dest(‘./dist/static’))

})

// 8. 创建一个 clean 任务

gulp.task(‘clean’, function () {

return gulp

.src(‘./dist’, {

allowEmpty: true

算法刷题

大厂面试还是很注重算法题的，尤其是字节跳动，算法是问的比较多的，关于算法，推荐《LeetCode》和《算法的乐趣》，这两本我也有电子版，字节跳动、阿里、美团等大厂面试题（含答案+解析）、学习笔记、Xmind思维导图均可以分享给大家学习。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

写在最后

最后，对所以做Java的朋友提几点建议，也是我的个人心得：

1. 疯狂编程

2. 学习效果可视化

3. 写博客

4. 阅读优秀代码

5. 心态调整