面试 JavaScript 框架八股文十问十答第六期

面试 JavaScript 框架八股文十问十答第六期

作者:程序员小白条,个人博客

相信看了本文后,对你的面试是有一定帮助的!关注专栏后就能收到持续更新!

⭐点赞⭐收藏⭐不迷路!⭐

1)use strict是什么意思 ? 使用它区别是什么?

"use strict" 是在 JavaScript 中的严格模式声明。它是 ECMAScript 5 引入的一项特性,用于提供更强的错误检查和更规范的行为。使用严格模式有以下特点:

  • 错误检测: 严格模式会更严格地检查代码中的错误,并在一些情况下抛出错误,例如变量未声明时。
  • 安全性提高: 一些不安全的操作,例如禁止使用 with 语句,可以避免在严格模式下使用。
  • 更严格的 this 指向: 在函数内部,严格模式下 this 的值为 undefined,而非严格模式下可能指向全局对象。
  • 禁止删除变量、函数等: 在严格模式下,使用 delete 删除变量、函数等操作是被禁止的。
  • 禁止重复的参数名和属性名: 严格模式下不允许定义重复的函数参数名和对象字面量中的重复属性名。

使用 use strict 的区别在于它会对代码执行施加更多的限制和规则,提高代码质量和可维护性。

// 严格模式示例
"use strict";// 在严格模式下,下面的代码会抛出错误
undefinedVariable = "Hello"; // ReferenceError: undefinedVariable is not defined

2)如何判断一个对象是否属于某个类?

在 JavaScript 中,对象是否属于某个类通常通过检查其构造函数来判断。可以使用 instanceof 操作符来检查一个对象是否是某个类(或其原型链上的类)的实例。

示例:

class Animal {// ...
}const cat = new Animal();if (cat instanceof Animal) {console.log("cat is an instance of Animal");
} else {console.log("cat is not an instance of Animal");
}

上述代码中,通过 instanceof 操作符检查 cat 是否是 Animal 类的实例。如果是,则输出相应的信息。

3)强类型语言和弱类型语言的区别

  • 强类型语言(Strongly Typed):
    • 强类型语言要求变量的类型在编译时就已经明确,并且不允许隐式类型转换。
    • 在强类型语言中,对于不同类型的变量,进行操作时需要明确进行类型转换。
  • 弱类型语言(Weakly Typed):
    • 弱类型语言允许在运行时进行隐式类型转换。
    • 在弱类型语言中,变量的类型可以更灵活地进行转换,而不需要显式地声明类型。

比如,JavaScript 是一种弱类型语言,因为它允许在运行时进行隐式类型转换,而无需明确的类型声明。

// JavaScript 示例(弱类型)
let x = "5";
let y = 10;let result = x + y; // 字符串和数字相加,会发生隐式类型转换,结果为 "510"

在强类型语言中,上述操作可能会导致类型错误,需要显式进行类型转换。

4)解释性语言和编译型语言的区别

解释性语言和编译型语言的区别在于它们的代码执行方式:

  • 解释性语言在运行时逐行解释源代码,并将其转换为机器代码执行。解释性语言不需要显式的编译过程,代码可以直接运行。例如,JavaScript和Python都是解释性语言。
  • 编译型语言在运行之前需要先通过编译器将源代码转换为机器代码,然后再执行生成的机器代码。编译型语言的代码执行速度通常较快。例如,C++和Java都是编译型语言。

5)for…in和for…of的区别

or…in和for…of是JavaScript中的两种循环语句,它们的区别如下:

  • for…in循环用于遍历对象的可枚举属性。它会遍历对象及其原型链上的所有可枚举属性,并将属性名赋值给循环变量。例如,可以使用for…in循环遍历对象的属性并进行操作。

  • for…of循环用于遍历可迭代对象(如数组、字符串、Set、Map等)。它会遍历对象中的每个元素,并将元素的值赋值给循环变量。例如,可以使用for…of循环遍历数组的元素并进行操作。

const arr = [1, 2, 3];
for (let item of arr) {console.log(item); // 输出元素值:1, 2, 3
}
const obj = { a: 1, b: 2, c: 3 };
for (let prop in obj) {console.log(prop); // 输出属性名:"a", "b", "c"
}

6)如何使用for…of遍历对象

for…of循环不能直接用于遍历对象的属性,因为对象不是一个可迭代对象。但是可以通过结合Object.keys()方法和for…of循环来遍历对象的属性。Object.keys()方法会返回一个包含对象自身可枚举属性的数组,然后可以使用for…of循环来遍历这个数组,进而遍历对象的属性。

const obj = { a: 1, b: 2, c: 3 };
for (let key of Object.keys(obj)) {console.log(key); // 输出属性名:"a", "b", "c"
}

7)ajax、axios、fetch的区别

ajax、axios和fetch都是用于发送HTTP请求的工具,它们的区别如下:

  • ajax是一种基于XMLHttpRequest对象的原生JavaScript方法,用于发送异步请求。它可以发送各种类型的请求(如GET、POST等),并且可以通过设置回调函数处理响应结果。ajax的使用相对较底层,需要手动处理请求和响应的细节。
  • axios是一个基于Promise的HTTP客户端,可以在浏览器和Node.js环境中使用。它封装了XMLHttpRequest对象,提供了更简洁和高级的API,支持更多的请求配置和拦截器等功能。axios使用起来更加方便和灵活。
  • fetch是浏览器原生的API,用于发送HTTP请求。它基于Promise,提供了一种简单、直观的方式来发送请求和处理响应。fetch的API设计更加现代化,支持链式调用和使用ES6的语法特性。然而,fetch在某些方面(如错误处理和请求取消)上相对不够完善,需要额外的处理。

8)数组的遍历方法有哪些

数组的遍历方法有以下几种:

  • for循环:使用传统的for循环可以遍历数组,通过索引访问每个元素。
  • forEach方法:forEach方法是数组的一个内置方法,它接受一个回调函数作为参数,对数组中的每个元素进行遍历操作。
  • map方法:map方法也是数组的一个内置方法,它接受一个回调函数作为参数,对数组中的每个元素进行遍历操作,并返回一个新的数组,新数组的每个元素是回调函数的返回值。
  • for…of循环:for…of循环是ES6中引入的一种新的循环语句,可以用于遍历可迭代对象(包括数组)的元素。
  • for…in循环:for…in循环用于遍历对象的可枚举属性,但不推荐用于遍历数组,因为它会遍历数组的所有属性,包括原型链上的属性。

9)forEach和map方法有什么区别

forEach方法和map方法的区别如下:

  • forEach方法:它会对数组中的每个元素执行回调函数,但不返回新的数组。它通常用于对数组进行遍历操作,可以在回调函数中对数组元素进行修改,但无法改变原数组。
const arr = [1, 2, 3];
arr.forEach((item, index) => {console.log(item); // 输出数组元素:1, 2, 3
});
  • map方法:它会对数组中的每个元素执行回调函数,并返回一个新的数组,新数组的每个元素是回调函数的返回值。它通常用于对数组进行变换操作,可以通过回调函数的返回值来生成新的数组。
const arr = [1, 2, 3];
const newArr = arr.map((item, index) => {return item * 2;
});
console.log(newArr); // 输出新数组:[2, 4, 6]

10)对原型、原型链的理解

原型(prototype)是JavaScript中的一个对象特性,每个对象都有一个原型。原型链是由对象的原型组成的一条链,用于查找对象的属性和方法。

  • 原型:每个对象(包括函数)都有一个原型对象,它是一个普通的对象。可以通过Object.prototype来访问原型对象。在原型对象中定义的属性和方法可以被该对象的所有实例共享。
  • 原型链:每个对象都有一个指向其原型的链接,形成原型链。当访问一个对象的属性或方法时,如果对象本身没有该属性或方法,JavaScript引擎会沿着原型链向上查找,直到找到该属性或方法或者到达原型链的末端(即Object.prototype)。

原型和原型链的作用包括:

  • 实现属性和方法的继承:通过原型链,子对象可以继承父对象的属性和方法。
  • 节省内存:多个对象共享同一个原型对象,避免了重复定义相同的属性和方法。
  • 动态添加属性和方法:可以在原型对象上动态添加属性和方法,所有实例对象都能够访问到。

例如,可以通过构造函数和原型来创建对象,并使用原型链实现属性和方法的继承:

function Person(name) {this.name = name;
}Person.prototype.sayHello = function() {console.log("Hello, " + this.name);
}const person = new Person("Alice");
person.sayHello(); // 输出 "Hello, Alice"

开源项目地址:https://gitee.com/falle22222n-leaves/vue_-book-manage-system

已 300 + Star!

⭐点赞⭐收藏⭐不迷路!⭐

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/674163.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

蓝桥杯Web应用开发-CSS3 新特性【练习二:获得焦点验证】

页面上有一个姓名输入框和一个密码输入框&#xff0c;当聚焦输入框时&#xff0c;输入框的背景颜色会发生改变&#xff0c; 新建一个 index3.html 文件&#xff0c;在其中写入以下内容。 <!DOCTYPE html> <html lang"en"><head><meta charset&…

16:定时器和计数器

定时器和计数器 1、定时器和计数器的介绍2、定时器是如何工作3、寄存器4、51单片机定时器简介&#xff08;数据手册&#xff09;5、定时器中的寄存器&#xff08;数据手册&#xff09;5.1、TCON&#xff08;定时器控制寄存器&#xff09;5.2、TMOD&#xff08;工作模式寄存器&a…

Python报No such file or directory: ‘science‘的解决方法

接上一篇博文&#xff1a;时间序列异常检测论文TranAD: Deep Transformer Networks for Anomaly Detection in Multivariate Time Series Data-CSDN博客 还是想看看这篇论文的可视化结果。但是当我重新运行原版代码的时候&#xff0c;会报错&#xff1a; FileNotFoundError: …

java学习06---方法

一 方法 方法&#xff08;method&#xff09;是程序中最小的执行单元 注意&#xff1a; 方法必须先创建才可以使用&#xff0c;该过程成为方法定义 方法创建后并不是直接可以运行的&#xff0c;需要手动使用后&#xff0c;才执行&#xff0c;该过程成为方法调用 二 方法的…

Mysql-数据库压力测试

安装软件 官方软件 安装插件提供了更多的监听器选项 数据库驱动 数据库测试 配置 这里以一个简单的案例进行&#xff0c;进行连接池为10,20,30的梯度压测&#xff1a; select * from tb_order_item where id 1410932957404114945;新建一个线程组 新增一个连接池配置 新建一…

JSON简介

简介 JSON&#xff0c;即JavaScript对象表示法&#xff0c;是一种用于共享数据的格式。顾名思义&#xff0c;JSON 源自 JavaScript 编程语言&#xff0c;但也可被许多其他语言使用&#xff0c;包括 Python、Ruby、PHP 和 Java。JSON 通常发音为“杰森”。 JSON 也具有可读性强…

驾驭AI绘画:《AI魔法绘画》带你秒变顶级画手!

大家好&#xff0c;我是herosunly。985院校硕士毕业&#xff0c;现担任算法研究员一职&#xff0c;热衷于机器学习算法研究与应用。曾获得阿里云天池比赛第一名&#xff0c;CCF比赛第二名&#xff0c;科大讯飞比赛第三名。拥有多项发明专利。对机器学习和深度学习拥有自己独到的…

数据平台:湖仓一体、流批一体、存算分离的核心问题

一、为什么出现湖仓一体的技术架构 目前数据仓库存储的数据结构单一,只能存储结构化的数据,对于非结构化数据的存储需求,以及存储成本是数据仓库的主要问题,而非结构化数据存储在业务库,也造成数据不能相融和利用,为了解决非结构化数据的低成本的存储诞生了湖仓一体的技术…

从零开发短视频电商 Tesseract OCR 的 Java 拓展库 javacpp-presets

文章目录 简介添加依赖识别示例示例一 识别本地图片示例二 识别图像中的各个组件&#xff08;比如文本行&#xff0c;单词&#xff0c;或单个字符&#xff09;示例三 使用迭代器遍历识别结果及其选择项示例四 方向和脚本检测示例五 结果迭代器示例六 设置引擎、页面分割模式、语…

c# 加密解密帮助类

public class DEncryptHelper { #region Md5加密 /// <summary> /// 获取字符串MD5加密字符串 /// </summary> /// <param name"str">原始字符串</param> /// <returns>MD5加密字符串<…

redis之布隆过滤

目录 1、redis之布隆过滤 2、布隆过滤器原理 3、布隆过滤器使用步骤 初始化bitmap 添加占坑位 判断是否存在圜 1、redis之布隆过滤 布隆过滤&#xff1a;有一个初值都为0的bit数组和多个哈希函数构成&#xff0c;用来快速判断集合中是否存在某个元素。目的&#xff1a;减…

Python Paramiko 使用交互方式获取终端输出报错

近期接到一个需求&#xff0c;要批量登录网络设备获取配置。 原计划使用 Paramiko exec即可&#xff0c;但是后来发现&#xff0c;有些设备命令也执行了&#xff0c;但是没有回显。 于是尝试使用 invoke_shell() 方式。 前期调试倒是OK&#xff0c;直到遇见一个输出内容较长的…

MySQL 日期和时间函数全面指南

介绍: 在数据库管理中,有效处理日期和时间对于各种操作至关重要,从简单的数据检索到复杂的分析。MySQL提供了丰富的内置函数来高效地操作日期和时间值。在本指南中,我们将探讨MySQL的基本日期和时间函数的用法和功能,探讨它们的语法和实际示例。 CURDATE 和 CURRENT_DATE:…

facebook广告投流有几种方式

在Facebook上投放广告有多种方式&#xff0c;以下是一些常见的方式&#xff1a; 单一图片广告&#xff1a;这是最简单的广告格式&#xff0c;只需上传一张图片&#xff0c;并添加一些文本即可。这种广告类型适用于各种目标&#xff0c;包括提高品牌知名度、推广活动等。视频广…

python官网下载慢怎么办?这里是一些解决方法

为什么Python官网下载速度慢&#xff1f; Python官网是开源软件的官方网站&#xff0c;提供了Python编程语言的最新版本和相关资源供开发者下载。然而&#xff0c;由于全球用户访问量较大&#xff0c;有时候会导致Python官网的下载速度变慢或不稳定。这对于急需获取Python的开…

Kubernetes基础(十五)-k8s网络通信

1 k8s网络类型 2 Pod网络 2.1 同一pod内不同容器通信 Pod是Kubernetes中最小的可部署单元&#xff0c;它是一个或多个紧密关联的容器的组合&#xff0c;这些容器共享同一个网络命名空间和存储卷&#xff0c;因此Pod中的所有容器都共享相同的网络命名空间和IP地址——PodIP&a…

web 前端实现一个根据域名的判断 来显示不同的logo 和不同的标题

1.需求 有可能我做一个后台 web端 我想实现一套代码的逻辑 显示不同的公司主题logo以及内容&#xff0c;但是实际上 业务逻辑一样 2.实现 建一个store oem.ts 这个名为是 oem系统 oem.ts import { defineStore } from pinia;import { store } from /store;const oemDataLis…

Vue中v-on 可以监听多个方法吗

当然可以&#xff01;Vue.js是一款非常强大的JavaScript库&#xff0c;它提供了很多方便的方法和指令&#xff0c;使我们可以更容易地构建交互式的Web应用程序。其中&#xff0c;v-on指令是Vue.js中一个非常重要也非常常用的指令&#xff0c;它用于监听DOM事件&#xff0c;并在…

质数基础筛法

文章目录 埃氏筛线性筛 埃氏筛 埃氏筛是一种筛素数的方法&#xff0c;埃氏筛的思想很重要&#xff0c;主要是时间复杂度 朴素的埃氏筛的时间复杂度是 O ( n l o g n ) O(nlogn) O(nlogn) 这个复杂度是调和级数 vector<int>p; int vis[N];void solve() {rep(i,2,n){if(…

07-Java桥接模式 ( Bridge Pattern )

Java桥接模式 摘要实现范例 桥接模式&#xff08;Bridge Pattern&#xff09;是用于把抽象化与实现化解耦&#xff0c;使得二者可以独立变化 桥接模式涉及到一个作为桥接的接口&#xff0c;使得实体类的功能独立于接口实现类&#xff0c;这两种类型的类可被结构化改变而互不影…