這次帶給大家使用ES6時有哪些小技巧,ES6使用小技巧的注意事項有哪些,下面就是實戰案例,一起來看一下。
如果你還知道其他一些小技巧,歡迎留言。我很高興把它們補充進來。
1. 強制要求參數
ES6提供了預設參數值機制,讓你為參數設定預設值,防止在函數被調用時沒有傳入這些參數。
在下面的範例中,我們寫了一個required()函數作為參數a和b的預設值。這表示如果a或b其中有一個參數沒有在呼叫時傳值,會預設required()函數,然後拋出錯誤。
const required = () => {throw new Error('Missing parameter')}; const add = (a = required(), b = required()) => a + b; add(1, 2) //3 add(1) // Error: Missing parameter.
2. 強大的reduce
陣列的reduce方法用途很廣。它一般被用來把數組中每一項規約到單一值。但是你可以利用它做更多的事。
2.1 使用reduce同時實作map和filter
假設現在有一個數列,你希望更新它的每一項(map的功能)然後篩選出一部分( filter的功能)。如果是先使用map然後filter的話,你需要遍歷這個陣列兩次。
在下面的程式碼中,我們將數列中的值加倍,然後挑選出那些大於50的數。有註意到我們是如何非常有效率地使用reduce來同時完成map和filter方法的嗎?
const numbers = [10, 20, 30, 40]; const doubledOver50 = numbers.reduce((finalList, num) => { num = num * 2; if (num > 50) { finalList.push(num); } return finalList; }, []); doubledOver50; // [60, 80]
2.2 使用reduce取代map和filter
#如果你認真閱讀了上面的程式碼,你應該能理解reduce是可以取代map和filter的。
2.3 使用reduce匹配圓括號
reduce的另一個用途是能夠匹配給定字串中的圓括號。對於一個含有圓括號的字串,我們需要知道(和)的數量是否一致,並且(是否出現在)之前。
下面的程式碼中我們使用reduce可以輕鬆地解決這個問題。我們只需要先宣告一個counter變量,初值為0。在遇到(時counter加一,遇到)時counter減一。如果左右括號數目匹配,則最終結果為0。
//Returns 0 if balanced. const isParensBalanced = (str) => { return str.split('').reduce((counter, char) => { if(counter <p style="text-align: left;"><strong>2.4 統計數組中相同項目的個數</strong></p><p style="text-align: left;">很多時候,你希望統計數組中重複出現項目的個數然後用一個物件表示。那你可以使用reduce方法處理這個陣列。 </p><p style="text-align: left;">下面的程式碼將統計每種車的數目然後把總數用一個物件表示。 </p><pre class="brush:php;toolbar:false">var cars = ['BMW','Benz', 'Benz', 'Tesla', 'BMW', 'Toyota']; var carsObj = cars.reduce(function (obj, name) { obj[name] = obj[name] ? ++obj[name] : 1; return obj; }, {}); carsObj; // => { BMW: 2, Benz: 2, Tesla: 1, Toyota: 1 }
reduce的其他用途實在太多了,我建議你閱讀MDN的相關程式碼範例。
3. 物件解構
#3.1 刪除不需要的屬性
有時候你不希望保留某些物件屬性,也許是因為它們包含敏感資訊或只是太大了(just too big)。你可能會列舉整個物件然後刪除它們,但實際上只需要簡單的將這些無用屬性賦值給變量,然後把想要保留的有用部分作為剩餘參數就可以了。
下面的程式碼裡,我們希望刪除_internal和tooBig參數。我們可以把它們賦值給internal和tooBig變量,然後在cleanObject中儲存剩下的屬性以備後用。
let {_internal, tooBig, ...cleanObject} = {el1: '1', _internal:"secret", tooBig:{}, el2: '2', el3: '3'}; console.log(cleanObject); // {el1: '1', el2: '2', el3: '3'}
3.2 在函數參數中解構嵌套物件
在下面的程式碼中,engine是物件car中嵌套的一個對象。如果我們對engine的vin屬性感興趣,使用解構賦值可以輕鬆地得到它。
var car = { model: 'bmw 2018', engine: { v6: true, turbo: true, vin: 12345 } } const modelAndVIN = ({model, engine: {vin}}) => { console.log(`model: ${model} vin: ${vin}`); } modelAndVIN(car); // => model: bmw 2018 vin: 12345
3.3 合併物件
ES6帶來了擴充運算子(...)。它一般被用來解構數組,但你也可以用它來處理物件。
接下來,我們使用擴充運算子來展開一個新的對象,第二個物件中的屬性值會改寫第一個物件的屬性值。例如object2的b和c就會改寫object1的同名屬性。
let object1 = { a:1, b:2,c:3 } let object2 = { b:30, c:40, d:50} let merged = {…object1, …object2} //spread and re-add into merged console.log(merged) // {a:1, b:30, c:40, d:50}
4. Sets
#4.1 使用Set實作陣列去重
在ES6中,因為Set只儲存唯一值,所以你可以使用Set刪除重複。
let arr = [1, 1, 2, 2, 3, 3]; let deduped = [...new Set(arr)] // [1, 2, 3]
4.2 对Set使用数组方法
使用扩展运算符就可以简单的将Set转换为数组。所以你可以对Set使用Array的所有原生方法。
比如我们想要对下面的Set进行filter操作,获取大于3的项。
let mySet = new Set([1,2, 3, 4, 5]); var filtered = [...mySet].filter((x) => x > 3) // [4, 5]
5. 数组解构
有时候你会将函数返回的多个值放在一个数组里。我们可以使用数组解构来获取其中每一个值。
5.1 数值交换
let param1 = 1; let param2 = 2; //swap and assign param1 & param2 each others values [param1, param2] = [param2, param1]; console.log(param1) // 2 console.log(param2) // 1
5.2 接收函数返回的多个结果
在下面的代码中,我们从/post中获取一个帖子,然后在/comments中获取相关评论。由于我们使用的是async/await,函数把返回值放在一个数组中。而我们使用数组解构后就可以把返回值直接赋给相应的变量。
async function getFullPost(){ return await Promise.all([ fetch('/post'), fetch('/comments') ]); } const [post, comments] = getFullPost();
相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!
推荐阅读:
以上是使用ES6時有哪些小技巧的詳細內容。更多資訊請關注PHP中文網其他相關文章!

Python 中有许多方法可以帮助我们理解代码的内部工作原理,良好的编程习惯,可以使我们的工作事半功倍!例如,我们最终可能会得到看起来很像下图中的代码。虽然不是最糟糕的,但是,我们需要扩展一些事情,例如:load_las_file 函数中的 f 和 d 代表什么?为什么我们要在 clay 函数中检查结果?这些函数需要什么类型?Floats? DataFrames?在本文中,我们将着重讨论如何通过文档、提示输入和正确的变量名称来提高应用程序/脚本的可读性的五个基本技巧。1. Comments我们可

随着直播业务的火爆,越来越多的网站和应用开始加入直播这项功能。PHP作为一种流行的服务器端语言,也可以用来开发高效的直播功能。当然,要实现一个稳定、高效的直播功能需要考虑很多问题。下面列出了使用PHP开发直播功能的十个技巧,帮助你更好地实现直播。选择合适的流媒体服务器PHP开发直播功能,首先需要考虑的就是流媒体服务器的选择。有很多流媒体服务器可以选择,比如常

译者 | 赵青窕审校 | 孙淑娟你是否经常回头看看6个月前写的代码,想知道这段代码底是怎么回事?或者从别人手上接手项目,并且不知道从哪里开始?这样的情况对开发者来说是比较常见的。Python中有许多方法可以帮助我们理解代码的内部工作方式,因此当您从头来看代码或者写代码时,应该会更容易地从停止的地方继续下去。在此我给大家举个例子,我们可能会得到如下图所示的代码。这还不是最糟糕的,但有一些事情需要我们去确认,例如:在load_las_file函数中f和d代表什么?为什么我们要在clay函数中检查结果

PHP中的多表关联查询技巧关联查询是数据库查询的重要部分,特别是当你需要展示多个相关数据库表内的数据时。在PHP应用程序中,在使用MySQL等数据库时,多表关联查询经常会用到。多表关联的含义是,将一个表中的数据与另一个或多个表中的数据进行比较,在结果中将那些满足要求的行连接起来。在进行多表关联查询时,需要考虑表之间的关系,并使用合适的关联方法。下面介绍几种多

1.简介我们在日常使用Python进行各种数据计算处理任务时,若想要获得明显的计算加速效果,最简单明了的方式就是想办法将默认运行在单个进程上的任务,扩展到使用多进程或多线程的方式执行。而对于我们这些从事数据分析工作的人员而言,以最简单的方式实现等价的加速运算的效果尤为重要,从而避免将时间过多花费在编写程序上。而今天的文章费老师我就来带大家学习如何利用joblib这个非常简单易用的库中的相关功能,来快速实现并行计算加速效果。2.使用joblib进行并行计算作为一个被广泛使用的第三方Python库(

近年来,随着网络信息的急剧增长,网络爬虫技术在互联网行业中扮演着越来越重要的角色。其中,Go语言的出现为网络爬虫的开发带来了诸多优势,如高速度、高并发、低内存占用等。本文将介绍一些Go语言中的网络爬虫开发技巧,帮助开发者更快更好地进行网络爬虫项目开发。一、如何选择合适的HTTP客户端在Go语言中,有多种HTTP请求库可供选择,如net/http、GoRequ

今天给大家分享二个小技巧,第一个可以增加输出的逻辑,让框架逻辑变的更加清晰。先来看看正常情况下GPT的输出,以用户增长分析体系为例:下来我给加一个简单的指令,我们再对比看看效果:是不是效果更好一些?而且逻辑很清晰,当然上面的输出其实不止这些,只是为了举例而已。我们直接让GPT扮演一个资深的Python工程师,帮我写个学习计划吧!提问的时候只需后面加以下这句话即可!let'sthinkstepbystep接下来再看看第二个实用的指令,可以让你的文章更上一个台阶,比如我们让GPT写一个述职报告,这里

对于数据科学,Python通常被广泛地用于进行数据的处理和转换,它提供了强大的数据结构处理的函数,使数据处理更加灵活,这里说的“灵活性”是什么意思?这意味着在Python中总是有多种方法来实现相同的结果,我们总是有不同的方法并且需要从中选择易于使用、省时并能更好控制的方法。要掌握所有的这些方法是不可能的。所以这里列出了在处理任何类型的数据时应该知道的4个Python技巧。列表推导式ListComprehension是创建列表的一种优雅且最符合python语言的方法。与for循环和if语句相比,列


熱AI工具

Undresser.AI Undress
人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool
免費脫衣圖片

Clothoff.io
AI脫衣器

AI Hentai Generator
免費產生 AI 無盡。

熱門文章

熱工具

SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)

DVWA
Damn Vulnerable Web App (DVWA) 是一個PHP/MySQL的Web應用程序,非常容易受到攻擊。它的主要目標是成為安全專業人員在合法環境中測試自己的技能和工具的輔助工具,幫助Web開發人員更好地理解保護網路應用程式的過程,並幫助教師/學生在課堂環境中教授/學習Web應用程式安全性。 DVWA的目標是透過簡單直接的介面練習一些最常見的Web漏洞,難度各不相同。請注意,該軟體中

SecLists
SecLists是最終安全測試人員的伙伴。它是一個包含各種類型清單的集合,這些清單在安全評估過程中經常使用,而且都在一個地方。 SecLists透過方便地提供安全測試人員可能需要的所有列表,幫助提高安全測試的效率和生產力。清單類型包括使用者名稱、密碼、URL、模糊測試有效載荷、敏感資料模式、Web shell等等。測試人員只需將此儲存庫拉到新的測試機上,他就可以存取所需的每種類型的清單。

Atom編輯器mac版下載
最受歡迎的的開源編輯器

ZendStudio 13.5.1 Mac
強大的PHP整合開發環境