前端面试知识点

news2024/11/20 1:23:19

基本方法

在这里插入图片描述在 JavaScript 中,pushpopshiftunshift 是用于操作数组的方法,它们的作用如下:

  1. push:将一个或多个元素添加到数组的末尾,并返回修改后的数组的新长度。原始数组会被修改。

    const array = [1, 2, 3];
    array.push(4, 5); // [1, 2, 3, 4, 5]
    
  2. pop移除数组的最后一个元素,并返回被移除的元素。原始数组会被修改。

    const array = [1, 2, 3];
    const removedElement = array.pop(); // 3
    console.log(array); // [1, 2]
    
  3. shift:移除数组的第一个元素,并返回被移除的元素。原始数组会被修改。移除后,数组中的其他元素会自动前移。

    const array = [1, 2, 3];
    const removedElement = array.shift(); // 1
    console.log(array); // [2, 3]
    
  4. unshift:将一个或多个元素添加到数组的开头,并返回修改后的数组的新长度。原始数组会被修改。添加后,数组中的其他元素会自动后移。

    const array = [1, 2, 3];
    array.unshift(-1, 0); // [-1, 0, 1, 2, 3]
    

这些数组方法允许我们在数组的开头或末尾进行元素的添加或移除操作。它们可以用于动态地修改数组的内容,实现队列、栈等数据结构,或者在需要调整数组元素顺序时使用。

reduce

不改变原数组
.reduce() 是一个在很多编程语言中都存在的高阶函数,它用于对数组或集合中的元素进行累积操作。下面是一个 JavaScript 的示例,演示了如何使用 .reduce()

假设有一个包含数字的数组,你想计算数组中所有数字的总和:

const numbers = [1, 2, 3, 4, 5];

// 使用 reduce 计算总和
const sum = numbers.reduce((accumulator, currentValue) => {
  return accumulator + currentValue;
}, 0); // 初始值为 0

console.log(sum); // 输出 15,因为 1 + 2 + 3 + 4 + 5 = 15

在这个示例中,.reduce() 接受两个参数:

  1. 一个回调函数,这个函数有两个参数:accumulatorcurrentValueaccumulator 是累积的结果,而 currentValue 是当前正在处理的数组元素。
  2. 一个初始值,这个初始值会被赋给 accumulator,在第一次调用回调函数时使用。

回调函数会依次处理数组中的每个元素,将它们与累积的结果相结合,最终得到一个最终的累积值。

这只是 .reduce() 的一个简单示例,你可以使用 .reduce() 执行各种累积操作,例如查找最大值、最小值,或者执行更复杂的数据转换操作。

const array = [5,4,7,8,6,2,3,1];
 
1.求和
array.reduce((a,b) => a+b);//36
 
2.最大值
array.reduce((a,b) => a>b?a:b);//8
 
最小值
array.reduce((a,b) => a<b?a:b);//1
 
//推荐下面
var arr = [22,13,6,55,30];
 
var max = Math.max.apply(null, arr);
var min = Math.min.apply(null, arr);
console.log(max, min) // 55,6
 
 
let arr = [1,2,3]
//最大值
let maxValue= Math.max(...arr);
//最小值
let minValue= Math.min(...arr);

filter

map

split

不改变原始数组

用于把一个字符串分割成字符串数组。
在这里插入图片描述省略分割参数,就是空格
http://t.csdn.cn/pm5z6
http://t.csdn.cn/V4Qk8

splice 添加/删除

改变原数据
splice是不可以操作字符串,只能操作数组

slice 截取

不影响原数组
可以操作字符串,也可以操作数组

substr

只能操作字符串,不可以操作数组

const 对于复合数据类型

const arr=[1,2,3];arr.push(4,5);为什么不报错,不是const 不能修改吗
const关键字确实用于声明一个常量,意味着变量的引用不可变。然而,对于数组和对象这样的复合数据类型,const并不会限制修改其中的元素。

在你提供的代码中,arr是一个常量数组,使用const声明。虽然你不能重新分配arr这个变量,但你可以修改数组本身,例如向数组中添加元素。

arr.push(4, 5)并没有改变arr变量的引用,而是在现有的数组中添加了新的元素。这是因为const只保证变量的引用不会改变,而不是保证变量引用的对象本身不可变。

如果你尝试重新分配arr变量,例如 arr = [4, 5],那么会引发一个错误,因为重新分配会改变arr的引用。

总结:const关键字用于声明一个常量,对于复合数据类型(如数组和对象),const只保证变量的引用不可变,但并不限制修改对象本身的元素。

希望以上解释对你有帮助。如果还有其他问题,请随时提问。

let const var

let 是块作用域 for循环友好

var 是函数作用域,可以变量提升,同一个作用域下可以重复声明

const 块级作用域,声明是常量,常量被定义后就不能被修改。注意,常量在定义的时候就必须初始化,否则就会报错。

JS作用域

在函数作用域中可以访问全局作用域,而在全局作用域中不能访问函数作用域
当在函数作用域中使用一个变量时,它会先在自身作用域内查找,如果找到就直接使用,如果没有找到则会向上一级作用域查找,直到找到全局作用域为止。如果都没有找到则会报错。

块作用域是函数作用域的子集,就是{} for if

改变this指向

在这里插入图片描述

http://t.csdn.cn/Ojyqj

//推荐下面
var arr = [22,13,6,55,30];

var max = Math.max.apply(null, arr);
var min = Math.min.apply(null, arr);
console.log(max, min) // 55,6

let arr = [1,2,3]
//最大值
let maxValue= Math.max(…arr);
//最小值
let minValue= Math.min(…arr);

console.log.apply(console, arguments);
};

log(1); //1

log(1,2); //1 2

这里为什么arguments能直接使用,他是什么

在JavaScript函数中,arguments是一个特殊的对象,它包含了函数调用时传入的所有参数。arguments对象类似于数组,可以通过索引访问每个参数的值。

在上面的代码中,函数log通过使用console.log.apply(console, arguments)来实现将参数打印到控制台。其中arguments就代表了传入的参数列表,通过apply方法调用console.log并将arguments作为参数传递进去。

总结起来,arguments是指函数调用时传入的所有参数所组成的对象,在函数内部可以使用它来操作传入的参数。



css权值计算

在这里插入图片描述

在这里插入图片描述

块级元素、行内块、行内元素

参考文章 http://t.csdn.cn/7H0QU
http://t.csdn.cn/fSHXk
在这里插入图片描述
在这里插入图片描述

正则表达式

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

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

相关文章

Java 多线程系列Ⅰ(创建线程+查看线程+Thread方法+线程状态)

多线程基础 一、创建线程的五种方法前置知识1、方法一&#xff1a;使用继承Thread类&#xff0c;重写run方法2、方法二&#xff1a;实现Runnable接口&#xff0c;重写run方法3、方法三&#xff1a;继承Thread&#xff0c;使用匿名内部类4、方法四&#xff1a;实现Runnable&…

如何在,Linux中安装Luajit2.*

1.文件下载The LuaJIT Project 2.将下载文件上传到对应的服务器&#xff1a;例如/opt 3.进入对应的文件夹 4.make PREFIX/usr/local&#xff0c;设置安装路径 5.make install&#xff0c;编译安装 6.进入安装目录&#xff0c;cd /usr/local/include/luajit-2.0 7.luajit -v…

SAP FI之定义财务年和财务年度变式(Fiscal Year Variants)

目录 前言 一、财务年度/财务年度变式 二、使用步骤 1.配置步骤 前言 本文主要介绍SAP会计年度和SAP会计年度变式。 一、财务年度/财务年度变式 财务年度可以具有与日历年相同的期间&#xff0c;也可以不同。中国财政年度从1月到12月&#xff0c;称为历年制&#xff0c;有…

基于沙猫群算法优化的BP神经网络(预测应用) - 附代码

基于沙猫群算法优化的BP神经网络&#xff08;预测应用&#xff09; - 附代码 文章目录 基于沙猫群算法优化的BP神经网络&#xff08;预测应用&#xff09; - 附代码1.数据介绍2.沙猫群优化BP神经网络2.1 BP神经网络参数设置2.2 沙猫群算法应用 4.测试结果&#xff1a;5.Matlab代…

WebGL 同一缓冲区多种数据传入顶点着色器 gl.vertexAttribPointer()的步进和偏移参数

目录 目录 为了将顶点坐标传入着色器&#xff0c;需要遵循一下五步&#xff1a; 但是&#xff01;&#xff01;&#xff01; 示例代码&#xff1a; gl.vertexAttribPointer&#xff08;&#xff09;的函数规范 stride参数 顶点坐标数据 offset参数 顶点尺寸数据 首先…

KaiwuDB 助力能源企业实现 4 大价值提升

行业背景 近年来&#xff0c;随着能源行业数字化的不断推进&#xff0c;智能电网、可再生能源发电、分布式发电、微电网等技术蓬勃发展。越来越多的能源企业意识到数据管理与价值挖掘对储能及能源利用有着重大意义&#xff0c;并开始探索一套有效的数据库解决方案以应对分布式…

Chrome小恐龙快跑小游戏——Python实现

目录 视频演示 代码实现 视频演示 Chrome小恐龙快跑小游戏——Python实现 代码实现 import pygame import os import random pygame.init()# Global Constants SCREEN_HEIGHT 600 SCREEN_WIDTH 1100 game_over False SCREEN pygame.display.set_mode((SCREEN_WIDTH, SCR…

电子词典dictionary

一、项目要求&#xff1a; 1.登录注册功能&#xff0c;不能重复登录&#xff0c;重复注册。用户信息也存储在数据库中。 2.单词查询功能 3.历史记录功能&#xff0c;存储单词&#xff0c;意思&#xff0c;以及查询时间&#xff0c;存储在数据库 4.基于TCP&#xff0c;支持多客户…

三、mycat分库分表

第五章 分库分表 一个数据库由很多表的构成&#xff0c;每个表对应着不同的业务&#xff0c;垂直切分是指按照业 务将表进行分类&#xff0c;分布到不同 的数据库上面&#xff0c;这样也就将数据或者说压力分担到不同 的库上面&#xff0c;如下图&#xff1a; 系统被切分成了&…

three.js(四):react + three.js

绘制多个立方体 1.搭建reactts 项目 npx create-react-app basics-demo --template typescriptreactts 的用法可参考此链接&#xff1a; https://react-typescript-cheatsheet.netlify.app/docs/basic/setup 2.安装three依赖 npm install three types/three --save3.安装路…

200 套基于Java开发的Java毕业设计实战项目(含源码+说明文档)

文章目录 简介前言第一部分第二部分部分截图源码咨询 简介 博主介绍&#xff1a;✌程序员徐师兄、7年大厂程序员经历。全网粉丝30W、csdn博客专家、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌ 前言 对于java方向的毕业设计题目选题&#xf…

Weblogic漏洞(四)之 CVE-2018-2894 任意文件上传漏洞

CVE-2018-2894 任意文件上传漏洞 漏洞影响 Weblogic受影响的版本&#xff1a; 10.3.6.012.1.3.012.2.1.212.2.1.3 漏洞环境 此次我们使用的是vnlhub靶场搭建的环境&#xff0c;是vnlhub中的Weblogic漏洞中的CVE-2018-2894靶场&#xff0c;我们 cd 到 CVE-2018-2894&#x…

R3LIVE源码解析(6) — R3LIVE流程详解

目录 1 R3LIVE框架简介 2 R3LIVE的launch文件 3 R3LIVE的r3live_config文件 4 R3LIVE从哪开始阅读 1 R3LIVE框架简介 R3LIVE是香港大学Mars实验室提出的一种融合imu、相机、激光的SLAM方法&#xff0c;R3LIVE由两个子系统组成&#xff0c;一个激光惯性里程计&#xff08;L…

【无标题】8.31在华清

可以登录但是不能跳转

怎么用postman连接websocket

点击右侧栏的Collections&#xff0c;然后点击旁边的New&#xff0c;然后点击其中的WebSocket Request,然后输入Url&#xff0c;点击Connection&#xff0c;这里需要注意的是Url不能加上http://&#xff0c;因为这个不是http协议。

23062网络编程day5

根据select TCP服务器流程图编写服务器 #include <myhead.h> #define ERR_MSG(msg) do{\fprintf(stderr,"__%d__:",__LINE__);\perror(msg);\ }while(0)#define PORT 8888 #define IP "192.168.114.104"int keyboard_events(void); int cliConnect_…

美国纽约10日游

一、前言 我有两周断更了&#xff0c;原因是去纽约只顾着玩&#xff0c;没时间写&#xff0c;今天有时间正好和大家分享一下去纽约的攻略 二、以下是一个10天去美国纽约旅游的攻略&#xff0c;十万以内&#xff0c;包括机票、酒店、交通、餐饮和景点门票等费用&#xff1a; 第…

Leetcode ->206 反转链表

题目 算法思路及代码实现 #include <iostream> using namespace std;struct ListNode {int val; //当前节点的值ListNode *next;

目标检测笔记(十二):如何通过界面化操作YOLOv5完成数据集的自动标注

文章目录 一、意义二、修改源码获取三、自动标注前期准备四、开始自动标注五、可视化标注效果六、XML转换TXT 一、意义 通过界面化操作YOLOv5完成数据集的自动标注的意义在于简化数据标注的流程&#xff0c;提高标注的效率和准确性。 传统的数据集标注通常需要手动绘制边界框…

通信笔记:RSRP、RSRQ、RSNNR

0 基础概念&#xff1a;RE、RS和RB RE (Resource Element)&#xff1a;资源元素是 LTE 和 5G 网络中的最小物理资源单位。一个资源元素对应于一个子载波的一个符号周期。 RS (Reference Signal)&#xff1a;参考信号是在 LTE 和 5G 网络中用于多种目的的特定类型的信号。它们可…