【前端查漏补缺】每日10题 2023-12-25

2023-12-25 20:20

本文主要是介绍【前端查漏补缺】每日10题 2023-12-25,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

1. 实现lodash _get方法

_.get 是 Lodash 库中的一个方法,用于按照给定的路径从对象中获取值。它是一种安全的方式,可以避免在获取嵌套属性时出现的空指针错误。

_.get 方法的语法如下:

_.get(object, path, [defaultValue])

参数说明:

object:要从中获取值的对象。
path:表示要获取的属性路径的字符串或数组。
defaultValue(可选):如果路径不存在或获取的值为 undefined,则返回的默认值。
以下是一个示例:

const obj = {foo: {bar: {baz: 'value'}}
};const result = _.get(obj, 'foo.bar.baz');
console.log(result); // 输出 'value'const defaultValue = _.get(obj, 'foo.bar.qux', 'default');
console.log(defaultValue); // 输出 'default'

手动实现lodash._get

// 手动实现lodash_getconst lodash_get = (obj, path, defaultValue) => {const keys = Array.isArray(path) ? path : path.split(".");let result = obj;for (let key of keys) {if (result && typeof result === "object" && key in result) {result = result[key];} else {return defaultValue;}}return result;
};
const obj = {a: {b: {c: 1,},},
};
console.log(lodash_get(obj, ["a", "b", "c"], "no result"));
console.log(lodash_get(obj, "a.b.d", "no result"));

2. 介绍一下网络的分层

网络的分层是指将网络功能按照不同的层次组织起来,每一层负责特定的任务和功能。这种分层的设计使得网络的开发、管理和维护更加简化和灵活。最常用的网络分层模型是 OSI 参考模型和 TCP/IP 参考模型。

OSI 参考模型:在这里插入图片描述

物理层(Physical Layer):负责传输比特流,处理物理连接和电信号。
数据链路层(Data Link Layer):处理帧(Frame)的传输和错误检测,提供可靠的点对点通信。
网络层(Network Layer):负责寻址、路由和分组转发,实现不同网络之间的通信。
传输层(Transport Layer):提供端到端的可靠或不可靠的数据传输,确保数据的完整性和可靠性。
会话层(Session Layer):负责建立、管理和终止会话(Session)。
表示层(Presentation Layer):处理数据的格式、加密和压缩,确保数据能被正确解释。
应用层(Application Layer):提供网络服务和应用程序之间的接口,包括电子邮件、文件传输等。
TCP/IP 参考模型:
在这里插入图片描述

网络接口层(Network Interface Layer):处理数据在物理媒体上的传输。
互联网层(Internet Layer):负责 IP 地址分配、路由和分组转发。
传输层(Transport Layer):提供端到端的可靠或不可靠的数据传输,包括 TCP 和 UDP。
应用层(Application Layer):包括网络应用和协议,如 HTTP、FTP、SMTP 等。

3. tcp/udp是哪一层的?

TCP(传输控制协议)和 UDP(用户数据报协议)是传输层的协议,属于网络分层模型中的传输层。

传输层的主要任务是提供端到端的可靠或不可靠的数据传输服务。它通过使用不同的协议来实现这些服务。

TCP 是一种面向连接的协议,它提供可靠的数据传输。TCP 使用握手、确认和重传机制来确保数据的可靠性和完整性。它还提供流量控制和拥塞控制,以确保在网络拥塞的情况下仍能保持适当的数据传输速率。

UDP 是一种无连接的协议,它提供不可靠的数据传输。UDP 不提供可靠性保证,也不处理数据的重传或流量控制。相比于 TCP,UDP 的优点是传输速度快,开销小,适用于一些实时性要求较高的应用,如音视频传输、实时游戏等。

在 OSI 参考模型中,TCP 和 UDP 位于传输层。它们是应用程序和网络之间的桥梁,负责将应用程序的数据分割为数据包,并在网络中进行传输。

在 TCP/IP 参考模型中,TCP 和 UDP 也位于传输层。它们是 TCP/IP 协议族中的两个主要协议,用于在 IP 网络上提供可靠的或不可靠的数据传输。

4. tcp/udp的区别

TCP(传输控制协议)和 UDP(用户数据报协议)是两种常见的传输层协议,它们在以下几个方面有所区别:

连接性:TCP 是面向连接的协议,而 UDP 是无连接的协议。TCP 在通信之前需要建立连接,而 UDP 直接发送数据包。

可靠性:TCP 提供可靠的数据传输,通过确认和重传机制来确保数据的完整性和正确性。UDP 则不提供可靠性保证,不进行数据的确认和重传,接收方无法确定数据是否完整。

有序性:TCP 保证数据的有序传输,确保数据按照发送的顺序接收。UDP 不保证数据的有序性,接收方收到数据的顺序可能与发送方不同。

延迟和效率:TCP 由于提供了可靠性保证和有序性,需要进行数据确认和重传,因此在传输效率和延迟方面相对较低。UDP 没有这些额外的机制,传输效率高,延迟低。

流量控制和拥塞控制:TCP 提供了流量控制和拥塞控制机制,可以根据网络的状况调整数据的传输速率,以避免网络拥塞。UDP 不提供这些机制。

应用场景:由于 TCP 提供可靠性和有序性保证,适用于对数据准确性要求较高的应用场景,如文件传输、电子邮件、网页浏览等。UDP 适用于实时性要求较高、数据丢失可接受的应用场景,如音视频传输、实时游戏等。

综上所述,TCP 和 UDP 在连接性、可靠性、有序性、延迟和效率等方面存在区别。选择使用 TCP 还是 UDP 取决于具体的应用需求和场景要求。

这篇关于【前端查漏补缺】每日10题 2023-12-25的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/536820

相关文章

从入门到精通详解LangChain加载HTML内容的全攻略

《从入门到精通详解LangChain加载HTML内容的全攻略》这篇文章主要为大家详细介绍了如何用LangChain优雅地处理HTML内容,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 目录引言:当大语言模型遇见html一、HTML加载器为什么需要专门的HTML加载器核心加载器对比表二

前端如何通过nginx访问本地端口

《前端如何通过nginx访问本地端口》:本文主要介绍前端如何通过nginx访问本地端口的问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录一、nginx安装1、下载(1)下载地址(2)系统选择(3)版本选择2、安装部署(1)解压(2)配置文件修改(3)启动(4)

HTML中meta标签的常见使用案例(示例详解)

《HTML中meta标签的常见使用案例(示例详解)》HTMLmeta标签用于提供文档元数据,涵盖字符编码、SEO优化、社交媒体集成、移动设备适配、浏览器控制及安全隐私设置,优化页面显示与搜索引擎索引... 目录html中meta标签的常见使用案例一、基础功能二、搜索引擎优化(seo)三、社交媒体集成四、移动

HTML input 标签示例详解

《HTMLinput标签示例详解》input标签主要用于接收用户的输入,随type属性值的不同,变换其具体功能,本文通过实例图文并茂的形式给大家介绍HTMLinput标签,感兴趣的朋友一... 目录通用属性输入框单行文本输入框 text密码输入框 password数字输入框 number电子邮件输入编程框

HTML img标签和超链接标签详细介绍

《HTMLimg标签和超链接标签详细介绍》:本文主要介绍了HTML中img标签的使用,包括src属性(指定图片路径)、相对/绝对路径区别、alt替代文本、title提示、宽高控制及边框设置等,详细内容请阅读本文,希望能对你有所帮助... 目录img 标签src 属性alt 属性title 属性width/h

CSS3打造的现代交互式登录界面详细实现过程

《CSS3打造的现代交互式登录界面详细实现过程》本文介绍CSS3和jQuery在登录界面设计中的应用,涵盖动画、选择器、自定义字体及盒模型技术,提升界面美观与交互性,同时优化性能和可访问性,感兴趣的朋... 目录1. css3用户登录界面设计概述1.1 用户界面设计的重要性1.2 CSS3的新特性与优势1.

HTML5 中的<button>标签用法和特征

《HTML5中的<button>标签用法和特征》在HTML5中,button标签用于定义一个可点击的按钮,它是创建交互式网页的重要元素之一,本文将深入解析HTML5中的button标签,详细介绍其属... 目录引言<button> 标签的基本用法<button> 标签的属性typevaluedisabled

HTML5实现的移动端购物车自动结算功能示例代码

《HTML5实现的移动端购物车自动结算功能示例代码》本文介绍HTML5实现移动端购物车自动结算,通过WebStorage、事件监听、DOM操作等技术,确保实时更新与数据同步,优化性能及无障碍性,提升用... 目录1. 移动端购物车自动结算概述2. 数据存储与状态保存机制2.1 浏览器端的数据存储方式2.1.

基于 HTML5 Canvas 实现图片旋转与下载功能(完整代码展示)

《基于HTML5Canvas实现图片旋转与下载功能(完整代码展示)》本文将深入剖析一段基于HTML5Canvas的代码,该代码实现了图片的旋转(90度和180度)以及旋转后图片的下载... 目录一、引言二、html 结构分析三、css 样式分析四、JavaScript 功能实现一、引言在 Web 开发中,

CSS place-items: center解析与用法详解

《CSSplace-items:center解析与用法详解》place-items:center;是一个强大的CSS简写属性,用于同时控制网格(Grid)和弹性盒(Flexbox)... place-items: center; 是一个强大的 css 简写属性,用于同时控制 网格(Grid) 和 弹性盒(F