JS-39-underscore01-初识underscore

news2024/11/15 18:20:26

一、underscore简介

前面我们已经讲过了,JavaScript是函数式编程语言,支持高阶函数和闭包。

函数式编程非常强大,可以写出非常简洁的代码。例如Arraymap()filter()方法:

'use strict';
var a1 = [1, 4, 9, 16];
var a2 = a1.map(Math.sqrt); // [1, 2, 3, 4]
var a3 = a2.filter((x) => { return x % 2 === 0; }); // [2, 4]

现在问题来了,Arraymap()filter()方法,可是Object没有这些方法。此外,低版本的浏览器例如IE6~8也没有这些方法,怎么办?

方法一,自己把这些方法添加到Array.prototype中,然后给Object.prototype也加上mapObject()等类似的方法。

方法二,直接找一个成熟可靠的第三方开源库,使用统一的函数来实现map()filter()这些操作。

我们采用方法二,选择的第三方库就是underscore。

正如jQuery统一了不同浏览器之间的DOM操作的差异,让我们可以简单地对DOM进行操作,underscore则提供了一套完善的函数式编程的接口,让我们更方便地在JavaScript中实现函数式编程。

jQuery在加载时,会把自身绑定到唯一的全局变量$上,underscore与其类似,会把自身绑定到唯一的全局变量_上,这也是为啥它的名字叫underscore的原因。

用underscore实现map()操作如下:

let r = _.map([1, 2, 3], (x) => x * x);
console.log(r); // [1, 4, 9]

咋一看比直接用Array.map()要麻烦一点,可是underscore的map()还可以作用于Object:

'use strict';
_.map({ a: 1, b: 2, c: 3 }, (v, k) => k + '=' + v); // ['a=1', 'b=2', 'c=3']

在JavaScript中,underscore(也称为_)通常指的是一个流行的JavaScript库——Underscore.js。这个库提供了一组实用的函数,用于简化JavaScript编程过程。 

二、引入Underscore.js库

2-1、本地引入

Underscore.js 简介 | Underscore.js中文文档 | Underscore.js中文网

2-2、远程引入

BootCDN - Bootstrap 中文网开源项目免费 CDN 加速服务

三、lodash简介

Lodash是Underscore的一个分支,并在其基础上进行了改进和优化。

Lodash提供了跨环境迭代的支持,添加了诸如AMD支持、深度克隆、深度合并等Underscore没有提供的特性和功能。此外,Lodash的性能超过了Underscore,这使得它成为许多项目的首选。

Lodash和Underscore的用法非常相似。它们都提供了大量的工具函数来操作字符串、数组、对象等常见数据类型,使得开发者能够更便捷地进行数据操作和处理。

lodash官网:Lodash 简介 | Lodash中文文档 | Lodash中文网

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

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

相关文章

数据结构书后习题

p17 1&#xff0c; 个人解答&#xff1a; int DeleteMinElem(SqList &L,int &min) {int j 0;if (L.length 0){printf("error!");return 0;}int min L.data[0];for (int i 1; i < L.length; i){if (L.data[i] < min){min L.data[i];j i;}}L.dat…

电工与电子技术选择题填空题计算题复习题含参考答案

答案&#xff1a;更多答案&#xff0c;请关注【电大搜题】微信公众号 答案&#xff1a;更多答案&#xff0c;请关注【电大搜题】微信公众号 答案&#xff1a;更多答案&#xff0c;请关注【电大搜题】微信公众号 电工与电子技术复习题 一 . 单选题&#xff08;共 33 题&a…

[渗透测试学习] TwoMillion-HackTheBox

TwoMillion-HackTheBox 信息搜集 nmap扫描一下 nmap -sV -v 10.10.11.221扫描结果 PORT STATE SERVICE VERSION 22/tcp open ssh OpenSSH 8.9p1 Ubuntu 3ubuntu0.1 (Ubuntu Linux; protocol 2.0) 80/tcp open http nginx 3851/tcp f…

SAP 技巧:如何查询TCODE的节点路径。

目录 SAP 技巧&#xff1a;如何查询TCODE的节点路径。 步骤一&#xff1a;在命令栏里输入&#xff1a;Search_SAP_Menu 会弹出以上页面&#xff0c;然后输入你想查询的T-code。回车。 步骤二&#xff1a;找到正确路径&#xff0c; SAP 技巧&#xff1a;如何查询TCODE的节点路…

0418WeCross搭建 + Caliper测试TPS

1. 基本信息 虚拟机名称&#xff1a;Pure-Ununtu18.04 WeCross位置&#xff1a;/root/wecross-demo 2. 搭建并启动WeCross 参考官方指导文档 https://wecross.readthedocs.io/zh-cn/v1.2.0/docs/tutorial/demo/demo.html 访问WeCross网页管理平台 http://localhost:8250/s/…

变频超声波驱鸟器,变电站驱鸟

随着春夏季来临&#xff0c;各种鸟类活动也愈发频繁。这一时期&#xff0c;变电站内有很多中大型鸟类&#xff0c;选择在户外架空高压裸导线龙门架、主变进线支撑架等重要设备上筑巢停留&#xff0c;它们筑巢所用的枝干和各类杂物&#xff0c;时常会掉落&#xff0c;引发设备短…

SQL Server Management Studio 显示行号

前言 在使用 SQL Server Management Studio (SSMS) 进行数据库管理和查询时&#xff0c;能够看到代码的行号是非常有用的。这可以帮助您更容易地定位代码错误、讨论特定的代码行&#xff0c;或者在执行长查询时快速找到特定行。在本文中&#xff0c;我将向您展示如何在 SSMS 中…

怎么你出的MES方案像屎一样?

最近在一个群里面&#xff0c;大家普遍感受到制定MES技术方案变得越来越困难&#xff0c;客户也变得越来越挑剔&#xff0c;方案的复杂度也在不断增加。在竞标过程中&#xff0c;各方技术水平的差距变得越来越小&#xff0c;这让人们感到相当困扰。考虑到这一问题&#xff0c;我…

OpenHarmony多媒体-ohos_videocompressor

介绍 videoCompressor是一款ohos高性能视频压缩器。 目前实现的能力&#xff1a; 支持视频压缩 使用本工程 有两种方式可以下载本工程&#xff1a; 开发者如果想要使用本工程,可以使用git命令 git clone https://gitee.com/openharmony-sig/ohos_videocompressor.git --…

U盘文件突然消失?别急,这里有数据恢复的终极攻略!

在日常的工作和生活中&#xff0c;U盘几乎成了我们随身携带的“数据小仓库”&#xff0c;存放着各种重要的文件。然而&#xff0c;就在某一天&#xff0c;你突然发现U盘中的文件神秘失踪&#xff0c;仿佛从未存在过一般。这种突如其来的U盘文件消失&#xff0c;无疑让人措手不及…

docker拉取镜像速度慢

解决办法是配置阿里云镜像加速 在docker desktop的docker engine里添加 "registry-mirrors": ["https://owzy8hoh.mirror.aliyuncs.com"] 修改以后重启docker 参考&#xff1a; 【docker】Windows10系统下安装并配置阿里云镜像加速_docker desktop 配置…

MySQL中InnoDB的行级锁

InnoDB 实现了以下两种类型的行锁。 共享锁&#xff08;S&#xff09;&#xff1a;又称为读锁&#xff0c;简称S锁&#xff0c;共享锁就是多个事务对于同一数据可以共享一把锁&#xff0c;都能访问到数据&#xff0c;但是只能读不能修改。 排他锁&#xff08;X&#xff09;&am…

仿真科普|从设计到研发,CAE仿真技术为汽车智造保驾护航

2024年3月28日&#xff0c;对于汽车产业来说&#xff0c;是历史性的一天&#xff0c;作为近年汽车行业发布会流量最大的一次&#xff0c;小米SU7的发布让整个汽车圈为之沸腾&#xff0c;成功收割全平台热搜。时至今日&#xff0c;小米汽车依然热度不减。 随着“蔚、小、理、特…

利用米家通断器与双控开关改造排风扇,或手动或定时运行

改造前的排风扇接线图如下&#xff1a; 改造要求&#xff1a;实现手动与智能运行两种控制方式&#xff0c;互不影响。 改造后的米家通断器与双控开关接线图如下&#xff1a; 默认米家通断器与双控开关都是关闭状态。

Leetcode 4.18

Leetcode 1.无重复字符的最长子串2.最长回文子串3.整数反转4.字符串转换整数 (atoi)5.正则表达式匹配 1.无重复字符的最长子串 无重复字符的最长子串 滑动窗口&#xff0c;先让右指针右移&#xff0c;如果发现这个子串有元素和右指针当前元素重复。 则&#xff1a; 左指针右移…

OpenHarmony南向开发案例:【智能照相机】

样例简介 本Demo是基于Hi3516开发板&#xff0c;使用OpenHarmony3.0-LTS开发的应用。通过获取摄像头数据&#xff0c;实现预览拍照以及路视频等功能。并且通过后台AI服务识别唤醒词来进行语音控制拍照及录制视频。 应用运行效果图&#xff1a; 此为相机的预览界面。 样例原理…

#无FIFO驱动OV7670基于cubemx(草稿)

1.前言 之前在淘宝买了一个不带FIFO的OV7670&#xff0c;由于比赛和其他事一直搁置&#xff0c;现在有时间于是想玩一玩。我发现网上这个的教程多为标准库&#xff0c;有些甚至利用了DCMI&#xff08;数字摄像头接口&#xff0c;目前已知F4系列是有这个外设的&#xff09;。标…

ant-design-vue Table+Form表单实现表格内置表单验证,可自定义验证规则,触发必填项

代码示例如下&#xff1a; <!-- --> <template><a-button type"primary" style"padding-left: 10px; padding-right: 10px" click"handleAddRow"><template #icon><plus-outlined /></template>新增</…

SOT23-6封装单键触摸感应触发芯片TC233A

前言&#xff1a; 触摸芯片很多&#xff0c;现在触摸按键已经应用到很多行业&#xff0c;虽然不能覆盖所有的按键&#xff0c;但确实用的越来越多&#xff0c;国产的价格也便宜的令人发指&#xff0c;比如这个TC233A&#xff0c;也就一毛多一点。 TC233A概述 TC233A 是一个单…

【机器学习入门】推导超级详细,一文讲清楚支持向量机(SVM)【从原理到代码】

支持向量机(SVM)是机器学习中非常经典的一个模型&#xff0c;所以我就把这个作为第二个深入学习的机器学习模型&#xff0c;然后发现居然还挺难的&#xff08;调包侠流下无能泪水&#xff09;。 参考了很多博客&#xff0c;但是大部分博客都是讲一部分&#xff0c;要么数学部分…