移动应用开发实验室web组js第一次考核

请简述var,let,const的区别

var

  1. var存在变量提升、暂时性死区
  2. 可以重复赋值

let

  1. let不存在变量提升、暂时性死区
  2. 块级作用域
  3. 可以重复赋值

const

  1. const不存在变量提升、暂时性死区
  2. 声明时必须定义值
  3. 块级作用域

解释垃圾回收机制,垃圾回收的方式

垃圾回收机制

如果一个对象不再被程序中的任何部分所引用,那么这个对象就可以被回收。垃圾回收器会定期检查并回收这些不再被使用的内存空间

垃圾回收的方式

  1. 标记清除
  2. 标记整理
  3. 分代收集
  4. 引用计数

以下代码的输出是什么

var tmp=new Date()
function fn(){console.log(tmp);if(false){var tmp='hello world'}
}
fn()

undefined
由于tmp只被定义了没被赋值,而if操作不会被执行

this的指向

var name = "window";
var person = {name: "person",sayName: function () {console.log(this.name);//person},hello: () => console.log(this.name)//window
};
function sayName() {var sss = person.sayName;sss();//windowperson.sayName();//person(person.sayName)();//window,person.sayName 被引用并立即调用,但同样作为普通函数调用,而不是作为对象的方法(b = person.sayName)();//window,同上种情况类似person.hello()//window,箭头函数的this指向上下文的this值
}
sayName();

实现数组扁平化

let arr = [1, [2, [3, 4, 5]]]

方法1:使用递归

递归是一种直接且易于理解的方法,特别是当数组的嵌套层次未知时。

function flattenArray(arr) {  let result = [];  arr.forEach(item => {  if (Array.isArray(item)) {  result = result.concat(flattenArray(item));  } else {  result.push(item);  }  });  return result;  
}  let arr = [1, [2, [3, 4, 5]]];  
console.log(flattenArray(arr)); // 输出: [1, 2, 3, 4, 5]

方法2:使用扩展运算符(ES6+)

这种方法适用于嵌套层数较少且已知的情况,或者与递归结合使用。

function flattenArray(arr) {  while (arr.some(item => Array.isArray(item))) {  arr = [].concat(...arr);  }  return arr;  
}  let arr = [1, [2, [3, 4, 5]]];  
console.log(flattenArray(arr)); // 输出: [1, 2, 3, 4, 5]

方法3:使用栈(迭代方式)

迭代方式使用栈来模拟递归过程,对于深度较大的数组来说,可以避免递归可能导致的栈溢出问题。

function flattenArray(arr) {  let stack = [...arr];  let res = [];  while (stack.length) {  // pop 出 stack 的最后一个元素  let next = stack.pop();  if (Array.isArray(next)) {  // 如果是数组,则展开后并入 stack  stack.push(...next);  } else {  // 否则,添加到结果数组中  res.push(next);  }  }  // 注意:因为是从 stack 尾部取元素,所以结果需要反转  return res.reverse();  
}  
let arr = [1, [2, [3, 4, 5]]];  
console.log(flattenArray(arr)); // 输出: [1, 2, 3, 4, 5]

方法4:使用flat()方法(ES2019+)

如果你使用的是较新的JavaScript环境(如ES2019及以上),则可以直接使用数组的flat()方法来实现扁平化

let arr = [1, [2, [3, 4, 5]]];  
// Infinity 表示无论多少层嵌套都扁平化  
console.log(arr.flat(Infinity)); // 输出: [1, 2, 3, 4, 5]

flat()方法接受一个参数,表示要展开的嵌套层数。如果参数是Infinity,则表示无论嵌套了多少层,都将展开成一层。

实现数组去重

const array = [1, 2, 3, 5, 1, 5, 9, 1, 2, 8];

方法1:使用Set

Set是ES6中引入的一种新的数据结构,它类似于数组,但是成员的值都是唯一的,没有重复的值。利用这个特性,我们可以很容易地去除数组中的重复元素

const array = [1, 2, 3, 5, 1, 5, 9, 1, 2, 8];  
const uniqueArray = [...new Set(array)];  
console.log(uniqueArray); // 输出: [1, 2, 3, 5, 9, 8]

方法2:使用filter()和indexOf()

filter()方法创建一个新数组,其包含通过所提供函数实现的测试的所有元素。而indexOf()方法返回在数组中可以找到一个给定元素的第一个索引,如果不存在,则返回-1。利用这个特性,我们可以检查元素是否已经在结果数组中

const array = [1, 2, 3, 5, 1, 5, 9, 1, 2, 8];  
const uniqueArray = array.filter((item, index, self) => {  return self.indexOf(item) === index;  
});  
console.log(uniqueArray); // 输出: [1, 2, 3, 5, 9, 8]

方法3:使用Map对象

Map对象保存键值对,并且一个键可以映射到最多一个值。利用这个特性,我们可以将数组中的元素作为键存储到Map对象中,然后获取Map对象的键组成一个新数组,从而实现去重

const array = [1, 2, 3, 5, 1, 5, 9, 1, 2, 8];  
const map = new Map();  
array.forEach(item => map.set(item, true));  
const uniqueArray = Array.from(map.keys());  
console.log(uniqueArray); // 输出: [1, 2, 3, 5, 9, 8]

方法4:使用reduce()

reduce()方法对数组中的每个元素执行一个由您提供的reducer函数(升序执行),将其结果汇总为单个返回值。这个方法也可以用来去重

const array = [1, 2, 3, 5, 1, 5, 9, 1, 2, 8];  
const uniqueArray = array.reduce((acc, current) => {  if (acc.indexOf(current) === -1) acc.push(current);  return acc;  
}, []);  
console.log(uniqueArray); // 输出: [1, 2, 3, 5, 9, 8]

JS中的基本类型

number数字型
string字符串型
boolean布尔型 let isCool = true
undefined未定义型,没赋值,不确定是什么类型
null空类型
bigInt(范围比正常的number大)
symbol唯一的值

讲一下JS的事件流

事件流描述了当事件发生时,事件如何传播通过DOM的层次结构。主要有两种事件流模型被广泛认知:事件冒泡和事件捕获

事件冒泡

当事件在DOM的某个元素上被触发时,这个事件会沿着DOM树向上传播,依次触发祖先元素上的同名事件处理函数,直到达到最顶层的元素或者某个祖先元素阻止了事件的进一步传播

事件捕获

与事件冒泡相反,事件捕获是事件从DOM树的最顶层开始向下传播到目标元素的过程。这意味着,在事件到达目标元素之前,它会先触发目标元素的所有祖先元素上的事件处理函数

事件流

首先进行事件捕获,然后是目标元素本身的事件处理,最后是事件冒泡

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

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

相关文章

【Verilog学习日常】—牛客网刷题—Verilog企业真题—VL77

编写乘法器求解算法表达式 描述 编写一个4bit乘法器模块,并例化该乘法器求解c12*a5*b,其中输入信号a,b为4bit无符号数,c为输出。注意请不要直接使用*符号实现乘法功能。 模块的信号接口图如下: 要求使用Verilog HDL语言实现以上…

水下目标检测数据集 urpc2021

项目背景: 水下目标检测在海洋科学研究、水下考古、海洋资源勘探等多个领域具有重要的应用价值。由于水下环境的复杂性和多变性,传统的人工检测方法存在诸多限制,自动化检测技术的需求日益增加。URPC2021数据集旨在为水下目标检测提供高质量…

蔚来是如何算加电网络的「大账」的?

作者 | 张马也 编辑 | 德新 李斌很忙,连中秋假期也没休息,开着ES8在新疆喀什周边的县区考察。 这次考察的目的,是为了推进「加电县县通」计划的落地。蔚来在一个月前的加电日发布会,推出了这个大胆的计划,要实现全国县…

如何在webots中搭建一个履带机器人

前期准备 下载webotswebots基本知识 a. 官方文档:Webots documentation: Track b. B站教程:webots-超详细入门教程(2020)_哔哩哔哩_bilibili搭建流程 搭建履带机器人主要使用到了webots中的track节点,这个节点是专门用来定义履带的相关属性,模拟履带运动的 首先,创建一个…

C一语言—动态内存管理

目录 一、为什么要有动态内存管理 二、malloc和free (2.1)malloc (2.2)free 三、calloc和realloc (3.1)calloc (3.2)realloc 四、常见的动态内存的错误(举例均为错…

sqli-lab靶场学习(四)——Less11-14(post方法)

前言 第1-10关都是get方法,本关开始进入post方法。其实post也好get也好,本质都差不多,使用的技巧也基本相同。 Less11 第11关打开是一个输入用户名密码的界面 显然登陆对话框会使用post方式提交,这里我们尝试在Username一栏通过…

Scrapy爬虫实战——某瓣250

# 按照我个人的习惯,在一些需要较多的包作为基础支撑的项目里,习惯使用虚拟环境,因为这样能极大程度的减少出现依赖冲突的问题。依赖冲突就比如A、B、C三个库,A和B同时依赖于C,但是A需要的C库版本大于N,而B…

Python中lambda表达式的使用——完整通透版

文章目录 一、前言二、 基本语法三、举个简单的例子:四、常见应用场景1. 用于排序函数sort() 方法简介lambda 表达式的作用详细解释进一步扩展总结 2、与 map、filter、reduce 等函数结合1、 map() 函数示例:将列表中的每个数字平方 2、 filter() 函数示…

音视频直播应用场景探讨之RTMP推流还是GB28181接入?

技术背景 好多开发者跟我们沟通音视频解决方案的时候,不清楚什么时候用RTMP推送模块,什么时候用GB28181设备接入模块,也不清楚二者差异化。实际上,RTMP推流和GB28181接入模块,在很多方面存在差异,如应用领…

centos 安装VNC,实现远程连接

centos 安装VNC,实现远程连接 VNC(Virtual Network Computing)是一种远程控制软件,可以实现通过网络远程连接计算机的图形界面。 服务器安装VNC服务 yum install -y tigervnc-server*启动VNC服务,过程中需要输入连接密码 vncserver :1查看…

云栖大会Day1:云应用开发平台 CAP 来了

2024 云栖大会开幕,在大会第一天,阿里云正式发布全新产品——云应用开发平台 CAP。CAP 拥有丰富的场景化应用模板,可以极速体验,并且具备更低的成本优势以及灵活组装等特点,成为广大开发者与企业必备的一站式应用开发平…

Stable Diffusion绘画 | ControlNet应用-instant-ID控制器:快速生成人物多角度图片

使用 instant-ID 控制器,用户只需要提供一张正脸图片,就可以快速地给人物生成多角度图片的,从而很好的保持了人物的一致性。 对于要制作小说推文、创建人物故事情节的创作,是一个非常好用且高效的功能。 准备工作 使用该控制类型&…

【UE5】将2D切片图渲染为体积纹理,最终实现使用RT实时绘制体积纹理【第一篇-原理】

如果想直接制作,请看【第二篇】内容 这次做一个这样的东西,通过在2DRT上实时绘制,生成动态的体积纹理,也就是可以runtime的VDB 设想的文章流程: 对原理进行学习制作体积渲染制作实时绘制 第一篇(本篇)是对“…

vue3+element-plus icons图标选择组件封装

一、最终效果 二、参数配置 1、代码示例 <t-select-icon v-model"selectVlaue" />2、配置参数&#xff08;Attributes&#xff09;继承 el-input Attributes 参数说明类型默认值v-model绑定值string-prefixIcon输入框前缀iconstringSearchisShowSearch是否显…

机器翻译之创建Seq2Seq的编码器、解码器

1.创建编码器、解码器的基类 1.1创建编码器的基类 from torch import nn#构建编码器的基类 class Encoder(nn.Module): #继承父类nn.Moduledef __init__(self, **kwargs): #**kwargs&#xff1a;不定常的关键字参数super().__init__(**kwargs)def forward(self, X, *args…

Git入门学习(1)

Git 00.准备工作-gitee注册 今天Git的设置中需要用到gitee的注册信息&#xff0c;先自行完成注册工作&#xff0c;可以 参考笔记 或第二天视频&#xff08;10.Git远程仓库-概念和gitee使用准备&#xff09; 传送门: gitee&#xff08;码云&#xff09;:https://gitee.com/ 注…

详解:冒泡排序

1.是什么 冒泡排序&#xff08;Bubble Sort&#xff09;是一种简单的排序算法。它重复地遍历要排序的数列&#xff0c;一次比较两个元素&#xff0c;如果它们的顺序错误就把它们交换过来。遍历数列的工作是重复地进行直到没有再需要交换&#xff0c;也就是说该数列已经排序完成…

2024华为杯研赛D题保姆级教程思路分析+教程

2024年中国研究生数学建模竞赛D题保姆级教程思路分析 D题&#xff1a;大数据驱动的地理综合问题&#xff08;数学分析&#xff0c;统计学&#xff09; 关键词&#xff1a;地理、气候、统计&#xff08;细致到此题&#xff1a;统计指标、统计模型、统计结果解释&#xff09; …

c++249多态

#include<iostream> using namespace std; class Parent { public:Parent(int a){this->a a;cout << " Parent" << a << endl;} public:virtual void print()//在子类里面可写可不写 {cout << "Parent" <<a<&l…

OpenCV 2

目录 图像平滑处理 高斯与中值滤波 图像阈值 ​编辑 Canny边缘检测 非极大值抑制 边缘检测效果 轮廓检测方法 ​编辑 ​编辑​编辑 轮廓检测结果 轮廓特征与近似 图像平滑处理 以上两种出来的图片效果 以上的效果&#xff0c;因为填的是normalize False&#xff0c;越界…