10月面试js基础

作用域

变量的可用范围

作用域链

保存的变量的使用顺序的一个链(也就是路线图), 被称为作用域链。

当在Javascript中使用一个变量的时候,首先Javascript引擎会尝试在当前作用域下去寻找该变量,如果没找到,再到它的上层作用域寻找,以此类推直到找到该变量或是已经到了全局作用域。

如果在全局作用域里仍然找不到该变量,它就会在全局范围内隐式声明该变量(非严格模式下)或是直接报错。

词法环境

是一种标识符---变量 映射的结构(这里的标识符 指的是变量/函数的名字,变量是对实际对象[包含函数和数组类型的对象]或基础数据类型的引用)。

简单地说,词法环境是Javascript引擎用来存储变量和对象引用的地方。

闭包

能够读取其他函数内部变量的函数 。js里为了实现数据和方法私有化的方式。

1-实现模块化和私有变量

2-缓存数据

3-实现回调函数

面试原理之闭包的优缺点和应用场景 - 掘金 (juejin.cn)
闭包的缺点:

  1. 内存泄漏:由于闭包中的函数引用了外部函数的变量,而外部函数的作用域在函数执行结束后并不会被销毁,这就导致了闭包函数中的变量也无法被销毁,从而占用了内存空间。如果闭包被滥用,可能会导致内存泄漏的问题。
  2. 性能问题:闭包中的函数访问外部函数的变量需要通过作用域链来查找,而作用域链的长度决定了查找的速度。如果闭包层数较深,作用域链就会很长,从而影响了函数的执行效率。

为了解决闭包的这些问题,可以采取以下一些措施:

  1. 及时释放闭包:如果不再需要使用闭包,可以手动将其赋值为 null,从而释放闭包中占用的内存空间。
  2. 减少闭包层数:尽量减少闭包层数,避免作用域链过长,从而提高函数的执行效率。
  3. 使用立即执行函数:可以使用立即执行函数来避免闭包的内存泄漏问题。由于立即执行函数在执行结束后会被立即销毁,因此其中的变量也会被释放。
  4. 使用模块化编程:可以使用模块化编程来避免闭包的性能问题。在模块化编程中,每个模块都是一个独立的作用域,不会对全局作用域造成影响,从而避免了作用域链过长的问题。
// 构造函数
function Person(name, age) {
    this.name = name;
    this.age = age;
}

// 生成实例
const p = new Person('zhangsan', 18);

new()方法做了什么

  1. 创建一个新对象

  2. 将新对象的__proto__指向构造函数的protptype对象

  3. 将构造函数的作用域赋值给新对象(也就是this指向新对象)

  4. 执行构造函数中的代码(为这个新对象添加属性)

  5. 返回新的对象

一文搞懂JS原型与原型链(超详细,建议收藏) - 掘金 (juejin.cn)

构造函数创建一个实例的过程

  1. 创建一个新对象
  2. 将构造函数的作用域赋值给新对象(这样this就指向了新对象)
  3. 执行构造函数中的代码(为新对象添加实例属性和实例方法)
  4. 返回新对象

原型

  • 每个函数都有prototype属性,被称作原型。
  • prototype原型指向一个对象,故也称作原型对象。

原型对象

JS的每个函数在创建的时候,都会生成一个属性prototype,这个属性指向一个对象,这个对象就是此函数的原型对象。该原型对象中有个属性为constructor,指向该函数。这样原型对象它的函数之间就产生了联系。
__proto__prototype不太一样,一个是对象拥有的隐式原型,一个是函数拥有的显式原型,这里我们简单总结一下__proto__

  • 通常被称作隐式原型,每个对象都拥有该属性。
  • [[prototype]]其实就是__proto__

原型链

当访问一个对象的某个属性时,会先在这个对象本身属性上查找,如果没有找到,则会通过它的__proto__隐式属性,找到它的构造函数原型对象,如果还没有找到就会再在其构造函数prototype__proto__中查找,这样一层一层向上查找就会形成一个链式结构,我们称为原型链

结论:每个对象都有 proto 属性,但只有函数对象才有 prototype 属性

JavaScript原型与原型链最全面的详解 - 掘金 (juejin.cn)

相关推荐
一雨方知深秋1 小时前
Element-plus安装及其基础组件使用
javascript·css·html·vue3·element-plus
2301_789169541 小时前
react crash course 2024(9) proxying
前端·javascript·react.js
计算机学姐1 小时前
基于nodejs+vue的超市管理系统
前端·javascript·vue.js·vscode·前端框架·node.js·ecmascript
Z_B_L1 小时前
three.js----快速上手,如何用vue在web页面中导入 gltf/glb , fbx , obj 模型
开发语言·前端·javascript
诗雅颂1 小时前
【js逆向学习】qqmusic(qq音乐)webpack智能导出
javascript·学习·webpack
小飞猪Jay2 小时前
面试扩展知识点
面试·职场和发展
计算机学姐2 小时前
基于nodejs+vue的宠物医院管理系统
前端·javascript·vue.js·mysql·npm·node.js·sass
余生H2 小时前
前端大模型入门:使用Transformers.js手搓纯网页版RAG(二)- qwen1.5-0.5B - 纯前端不调接口
前端·javascript·人工智能·大语言模型·rag·端侧大模型·webml
鱼跃鹰飞3 小时前
大厂面试真题-说一下Mybatis的缓存
java·后端·缓存·面试·职场和发展·mybatis
科研online3 小时前
ArcGIS Pro高级地图可视化—双变量符号地图
开发语言·javascript·arcgis