2024年Web前端最全【面试题】前端 js那些需要注意的小细节，五年前端开发者小米、阿里面经

结尾

正式学习前端大概 3 年多了，很早就想整理这个书单了，因为常常会有朋友问，前端该如何学习，学习前端该看哪些书，我就讲讲我学习的道路中看的一些书，虽然整理的书不多，但是每一本都是那种看一本就秒不绝口的感觉。

以下大部分是我看过的，或者说身边的人推荐的书籍，每一本我都有些相关的推荐语，如果你有看到更好的书欢迎推荐呀。

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

//当函数只有返回值时，return和{} 也能去掉
let add2 = x => x + x;
复制代码

### this 是什么？


`this`是指 谁在调用函数 ，如果没有就是`window`


* 任何函数本质上都是通过某一个对象来调用的 ，如果没有直接指定，就是`window`
* 所有函数内部都有一个变量`this`
* 它的值是调用函数的当前对象

test（）：window
p.test() : p
new test() : 新建的对象
p.call(obj) : obj
复制代码

1. 箭头函数在哪个作用域下声明，`this`就指向谁
2. 箭头函数和普通函数的区别`this`绑定
3. 普通的`function`不会绑定`this` 在进入到普通函数之前，`this`指向`Window`，进入普通函数之后，`this`就会变成该函数的指向,
4. 而箭头函数会绑定`this`，在进入到箭头函数之前，`this`指向`Windows`，进入之后，由于箭头函数会绑定`this`,所以这时候`this`还是指向`window`,
5. 如果先进入普通函数再进入箭头函数，`this`就会从进入之前的指向`window` 变成该函数指向；


#### 函数的protoype属性


每个函数都有一个`prototype`属性，它默认指向一个`Object`空对象（即称为：原型对象）这里 `Object`是一个函数 原型对象中有一个属性`constructor`，它指向函数对象 `Date.prototype.constructor===Date`


#### 给原型对象添加属性（一般是方法


函数的所有实例对象自动拥有原型对象中的所有属性（方法） 添加`Date.prototype.getSum=function（）{}` ，`Date`会有`getSum`这个方法


### 显式原型与隐式原型


* 每个函数function 都有一个`prototype`属性，即显式原型（属性）
* 每个实例对象 都有一个`__proto__`，可称为隐式原型（属性）
* 对象的隐式原型的值为其对应构造函数的显式原型的值 `Fn.prototype===fn.__proto__`都保存同一个对象的地址值 默认指向一个`Object`空对象，原型对象
* 原型链就是找隐式原型属性`__proto__`
* 原型链是用来查找对象属性的
* 读取对象的属性值时：会自动到原型链中去查找
* 设置对象属性值时：不会查找原型链，如果当前对象中没有该属性，会直接添加此属性并设置其值
* 方法一般定义在原型中`（__proto__）`,属性一般通过构造函数定义在对象本身上
* 函数的显式原型指向的对象默认是空`Object`实例对象，（但`Object`不满足这句话）因为原型对象其实就是一个对象，当然可以说是`Object`实例
* 所有函数都是`Function`的实例，（包括`Function`它自己）

Function.proto=== Function.prototype// true
复制代码

* Object的原型对象是原型链的尽头

Object.prototype.proto // null
复制代码

### 变量声明提升

//在定义语句之前就能访问到
var a =3
function fn(){
console.log(a)
var a=4
}
fn() // undefined
复制代码

因为变量会声明提升，在进入函数时，函数中`var`的变量会最先声明，但是没有赋值，然后再执行输出，最后执行赋值，所以结果是未定义，找变量会先在函数里面找，就近原则


### 箭头函数和普通函数的区别


1. 箭头不会绑定，普通函数会绑定（能绑定就是能改变）
2. `this`指向不同
3. 普通函数，谁调用这个函数，`this`指向谁
4. 箭头函数，在哪里定义函数，`this`指向谁
5. 箭头函数适合与`this`无关的回调，定时器，数组的回调
6. 不适合与`this`有关的回调，事件回调，对象的方法


**变量不是数据本身，它仅仅是存储数据的容器**

let a = [0,1,2];
let b = a;
b[0] = 5;
console.log(a);// [5, 1, 2]
复制代码

**数组后面习惯性敲一个空格**

// 获取用户输入的内容，并且输出到页面 1输入，2存储，3输出
let uname = prompt(‘请输入您的姓名：’)
document.write（uname）
复制代码

### js基本数据类型


1. 数字类型
2. 字符串类型
3. `boolean` 布尔类型
4. `undefined` 未定义类型 只声明，未赋值
5. `null`空类型


### 引用数据类型


1. `object` 对象
2. `function` 函数
3. `array` 数组
4. `js`推荐使用单引号引起字符串 “” ‘’``


**模板字符串 拼接字符串和变量 在反引号中可回车换行不报错**

document.write('大家好，我叫’ + name + ‘，今年’ + age + ‘岁’)
复制代码

**内容拼接变量时，用`${}`包住变量，整体用反引号引起**





### 结尾

正式学习前端大概 3 年多了，很早就想整理这个书单了，因为常常会有朋友问，前端该如何学习，学习前端该看哪些书，我就讲讲我学习的道路中看的一些书，虽然整理的书不多，但是每一本都是那种看一本就秒不绝口的感觉。

以下大部分是我看过的，或者说身边的人推荐的书籍，每一本我都有些相关的推荐语，如果你有看到更好的书欢迎推荐呀。

**[开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】](https://bbs.csdn.net/forums/4304bb5a486d4c3ab8389e65ecb71ac0)**

![前端学习书籍导图-1](https://img-blog.csdnimg.cn/img_convert/c0dc63a6360a753da38bf94bd5503230.webp?x-oss-process=image/format,png)

些相关的推荐语，如果你有看到更好的书欢迎推荐呀。

**[开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】](https://bbs.csdn.net/forums/4304bb5a486d4c3ab8389e65ecb71ac0)**

[外链图片转存中...(img-jxrKCsvk-1715393419749)]