【前端面试3+1】01闭包、跨域

news2024/9/20 8:15:39

一、对闭包的理解

定义

闭包是指在一个函数内部定义的函数,并且该内部函数可以访问外部函数的变量。闭包使得函数内部的变量在函数执行完后仍然可以被访问和操作。

特点:

闭包可以访问外部函数的变量,即使外部函数已经执行完毕。闭包可以保持外部函数的作用域不被销毁,从而延长变量的生命周期。

 应用:

闭包在 JavaScript 中被广泛应用,例如用于模块化开发、事件处理、异步编程等场景。闭包可以帮助我们隐藏变量,保护数据,以及实现高阶函数等功能。

作用:

  1. 封装变量:闭包可以帮助我们封装变量,避免全局变量污染。
  2. 保持作用域:闭包可以保持外部函数的作用域,延长变量的生命周期。
  3. 实现模块化:通过闭包可以实现模块化开发,将代码组织成独立的模块。
  4. 实现高阶函数:闭包可以作为参数传递给其他函数,实现高阶函数的功能。
  5. 实现私有变量:通过闭包可以实现私有变量和方法,保护数据安全。

优点:

  1. 封装性:闭包可以帮助我们封装变量和实现数据隐藏,提高代码的安全性和可维护性。
  2. 灵活性:闭包可以让函数拥有记忆功能,保持状态,实现更灵活的编程方式。
  3. 模块化:闭包可以帮助我们实现模块化开发,将代码组织成独立的模块,提高代码的可复用性。

缺点:

  1. 内存泄漏:如果闭包中引用了大量的外部变量,可能导致内存泄漏问题,需要注意内存管理。
  2. 性能问题:闭包会增加函数的作用域链长度,可能影响函数的执行效率,需要谨慎使用。
  3. 理解难度:闭包的概念相对抽象,可能增加代码的理解难度,需要深入理解才能正确应用。
function outerFunction() {
  let outerVar = 'I am outer';
  
  function innerFunction() {
    console.log(outerVar);
  }
  
  return innerFunction;
}

let closure = outerFunction();
closure(); // 输出 'I am outer'
```

在这个例子中,`innerFunction` 是一个闭包,可以访问 `outerFunction` 中定义的 `outerVar` 变量。

二、跨域的理解

定义:

       跨域是指在浏览器中,当前页面的域名、协议、端口和请求的目标资源的域名、协议、端口不一致时,浏览器会限制页面对资源的访问,这就是跨域。跨域是浏览器出于安全考虑而设置的限制,用于防止恶意网站获取用户的隐私信息。

如何解决跨域问题?


1. JSONP:通过动态创建 `<script>` 标签,利用 `<script>` 标签的跨域特性来获取数据。
2. CORS:跨域资源共享(Cross-Origin Resource Sharing),在服务端设置响应头,允许跨域请求。
3. 代理:通过服务器端转发请求,实现跨域访问

### 代理的原理:


代理是通过服务器端转发请求的方式解决跨域问题

具体原理如下:
1. 前端发送请求:前端将请求发送给自己的服务器,由自己的服务器代为转发。
2. 服务器接收请求:服务器接收到请求后,再向目标服务器发送请求。
3. 目标服务器响应:目标服务器响应结果后,服务器再将结果返回给前端。

        通过代理,前端请求的是自己的服务器,避免了跨域问题,而服务器之间的请求不受同源策略限制,可以正常通信。代理可以在服务器端对请求进行处理,如添加请求头、修改请求参数等,更加灵活地控制请求和响应。

总的来说,代理是一种常见的解决跨域问题的方法,通过服务器端转发请求实现前端与目标服务器之间的通信,避免浏览器的跨域限制。

三、路由模式有哪些?

  1. 哈希模式:使用 URL 中的 # 符号来标记路由,通过监听 hashchange 事件来实现路由的切换。例如:http://example.com/#/home。

  2. History 模式:利用 HTML5 的 History API,可以在不刷新页面的情况下改变 URL,实现路由的切换。例如:http://example.com/home。

四、 【算法】两数之和

给定一个整数数组 nums 和一个整数目标值 target,请你在该数组中找出 和为目标值 target  的那 两个 整数,并返回它们的数组下标。

你可以假设每种输入只会对应一个答案。但是,数组中同一个元素在答案里不能重复出现。

你可以按任意顺序返回答案。

1.解法一

暴力法:

int* twoSum(int* nums, int numsSize, int target, int* returnSize) {
    for (int i = 0; i < numsSize; ++i) {
        for (int j = i + 1; j < numsSize; ++j) {
            if (nums[i] + nums[j] == target) {
                int* ret = malloc(sizeof(int) * 2);
                ret[0] = i, ret[1] = j;
                *returnSize = 2;
                return ret;
            }
        }
    }
    *returnSize = 0;
    return NULL;
}

作者:力扣官方题解

        代码中通过两层循环遍历整数数组nums,找到两个数的索引ij,使得这两个数的和等于目标值target。如果找到了这样的两个数,则动态分配一个包含两个整数的数组ret,将这两个数的索引存入数组中,并将结果数组的大小设为2,最后返回这个数组ret。如果未找到满足条件的两个数,则将结果数组的大小设为0,并返回NULL

2.解法二

使用哈希表

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

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

相关文章

【编译tingsboard】出现gradle-maven-plugin:1.0.11:invoke (default)

出现的错误&#xff1a; [ERROR] Failed to execute goal org.thingsboard:gradle-maven-plugin:1.0.11:invoke (default) on project http: Execution default of goal org.thingsboard:gradle-maven-plugin:1.0.11:invoke failed: Plugin org.thingsboard:gradle-maven-plugi…

输出当前时间

用途&#xff1a;在项目中一些属性中设置当前时间 实例代码 import java.time.LocalDateTime; import java.time.format.DateTimeFormatter;public class time {public static void main(String[] args){LocalDateTime china LocalDateTime.now(); DateTimeFormatter forma…

SpringBoot学习之ElasticSearch下载安装和启动(Mac版)(三十一)

本篇是接上一篇Windows版本,需要Windows版本的请看上一篇,这里我们继续把Elasticsearch简称为ES,以下都是这样。 一、下载 登录Elasticsearch官网,地址是:Download Elasticsearch | Elastic 进入以后,网页会自动识别系统给你提示Mac版本的下载链接按钮 二、安装 下载…

深度学习 - PyTorch基本流程 (代码)

直接上代码 import torch import matplotlib.pyplot as plt from torch import nn# 创建data print("**** Create Data ****") weight 0.3 bias 0.9 X torch.arange(0,1,0.01).unsqueeze(dim 1) y weight * X bias print(f"Number of X samples: {len(…

huawei 华为 交换机 配置 LACP 模式的链路聚合示例 (交换机之间直连)

组网需求 如 图 3-22 所示&#xff0c; SwitchA 和 SwitchB 通过以太链路分别都连接 VLAN10 和 VLAN20 的网络&#xff0c;且SwitchA 和 SwitchB 之间有较大的数据流量。用户希望 SwitchA 和 SwitchB 之间能够提供较大的链路带宽来使相同VLAN 间互相通信。在两台 Switch 设备上…

flask_restful规范返回值之参数设置

设置重命名属性和默认值 使用 attribute 配置这种映射 , 比如&#xff1a; fields.String(attributeusername) 使用 default 指定默认值&#xff0c;比如&#xff1a; fields.String(defaultsxt) from flask import Flask,render_template from flask_restful import A…

C++ 输入与输出

数据输入输出 数据是程序处理的对象&#xff0c;输入输出操作是程序中不可或缺少的部分&#xff0c;C中输入输出操作都是通过函数调用实现的&#xff1b;C提供了一个“标准I/O库”。 格式输出函数-----printf 基本形式是&#xff1a; printf(“控制字符串”,输出项列表); 功能…

openwrt在校园网环境下开启nat6 (ipv6 nat)

如果将路由器接入校园网&#xff0c;我们只能获得一个128位掩码的ipv6地址。这个地址仅供路由器本身使用&#xff0c;而路由器后的设备无法获取到ipv6地址&#xff0c;因此我们可以利用网络地址转换&#xff08;NAT&#xff09;为这些设备分配本地ipv6地址。 下面是openwrt开启…

【C++练级之路】【Lv.16】红黑树(冰与火的碰撞,红与黑的史诗)

快乐的流畅&#xff1a;个人主页 个人专栏&#xff1a;《C语言》《数据结构世界》《进击的C》 远方有一堆篝火&#xff0c;在为久候之人燃烧&#xff01; 文章目录 引言一、红黑树的概念二、红黑树的模拟实现2.1 结点2.2 成员变量2.3 插入情况一&#xff1a;uncle在左&#xff…

Linux-进程控制(进程创建、进程终止、进程等待)

一、进程创建 1.1 fork函数介绍 在命令行下我们可以通过 ./ exe文件 来创建一个进程&#xff0c;通过fork函数&#xff0c;我们可以通过代码的形式从一个进程中创建一个进程&#xff0c;新进程为子进程&#xff0c;原进程为父进程&#xff0c;子进程在创建时&#xff0c;会与…

LabVIEW智能降噪系统

LabVIEW智能降噪系统 随着噪声污染问题的日益严重&#xff0c;寻找有效的降噪技术变得尤为关键。介绍了一种基于LabVIEW平台开发的智能降噪系统&#xff0c;该系统能够实时采集环境噪声&#xff0c;并通过先进的信号处理技术实现主动降噪&#xff0c;从而有效改善生活和工作环…

Stable Diffusion 进阶教程 - 二次开发(制作您的文生图应用)

目录 1. 引言 2. 基于Rest API 开发 2.1 前置条件 2.2 代码实现 2.3 效果演示 2.4 常见错误 3. 总结 1. 引言 Stable Diffusion作为一种强大的文本到图像生成模型&#xff0c;已经在艺术、设计和创意领域引起了广泛的关注和应用。然而&#xff0c;对于许多开发者来说&#xff…

『Apisix入门篇』从零到一掌握Apache APISIX:架构解析与实战指南

&#x1f4e3;读完这篇文章里你能收获到&#xff1a; &#x1f310; 深入Apache APISIX架构&#xff1a; 从Nginx到OpenResty&#xff0c;再到etcd&#xff0c;一站式掌握云原生API网关的构建精髓&#xff0c;领略其层次化设计的魅力。 &#x1f50c; 核心组件全解析&#xff…

深入了解 Linux 中的 MTD 设备:/dev/mtd* 与 /dev/mtdblock*

目录 前言一、什么是MTD子系统&#xff1f;二、 /dev/mtd* 设备文件用途注意事项 三、/dev/mtdblock* 设备文件用途注意事项 三、这两种设备文件的关系四、关norflash的一些小知识 前言 在嵌入式Linux系统的世界里&#xff0c;非易失性存储技术扮演着至关重要的角色。MTD&#…

4.2 循环语句loop,等差数列求和

汇编语言 1. 循环语句loop loop指令的格式是&#xff1a;loop 标号&#xff0c;CPU执行loop指令的时候&#xff0c;要进行两部操作 cx cx - 1;判断cx中的值&#xff0c;不为0则转至标号处执行程序&#xff0c;如果为0则向下执行 循环使用loop来实现&#xff0c;循环次数存…

基于深度学习的OCR,如何解决图像像素差的问题?

基于深度学习的OCR技术在处理图像像素差的问题时确实面临一定的挑战。图像像素差可能导致OCR系统无法准确识别文本&#xff0c;从而影响其精度和可靠性。尽管已经有一些方法如SRN-Deblur、超分SR和GAN系列被尝试用于解决这个问题&#xff0c;但效果并不理想。然而&#xff0c;这…

上位机图像处理和嵌入式模块部署(qmacvisual拟合圆和拟合椭圆)

【 声明&#xff1a;版权所有&#xff0c;欢迎转载&#xff0c;请勿用于商业用途。 联系信箱&#xff1a;feixiaoxing 163.com】 前面我们学习了拟合直线&#xff0c;今天继续学习下拟合圆和拟合椭圆。其实除了最后一步不同&#xff0c;两者的逻辑是差不多的。一般都是&#xf…

矩阵螺旋输出

问题描述&#xff1a; 所谓螺旋矩阵&#xff0c;顾名思义&#xff0c;就是将矩阵元素以螺旋顺序输出&#xff0c;如图&#xff1a; 解决思路&#xff1a; 由图不难发现&#xff0c;整个螺旋输出过程是一个个左下右上遍历的循环&#xff0c;只是遍历的规模在越变越小&#xff…

2.7、创建列表(List)

概述 列表是一种复杂的容器&#xff0c;当列表项达到一定数量&#xff0c;内容超过屏幕大小时&#xff0c;可以自动提供滚动功能。它适合用于呈现同类数据类型或数据类型集&#xff0c;例如图片和文本。在列表中显示数据集合是许多应用程序中的常见要求&#xff08;如通讯录、…

分享全栈开发医疗小程序 -带源码课件(课件无解压密码),自行速度保存

课程介绍 分享全栈开发医疗小程序 -带源码课件&#xff08;课件无解压密码&#xff09;&#xff0c;自行速度保存&#xff01;看到好多坛友都在求SpringBoot2.X Vue UniAPP&#xff0c;全栈开发医疗小程序 - 带源码课件&#xff0c;我看了一下&#xff0c;要么链接过期&…