JavaScript ES6的函數(shù)拓展
ES6函數(shù)拓展
函數(shù)的默認參數(shù)
之前的寫法:
function count(x, y) {
?? ?return x + y;
}
count(3);//因為只傳遞了參數(shù)x,y的默認值為undefined
//undefined + 3返回NaN
function count(x, y) {
?? ?x = x || 0;
?? ?y = y || 0;
?? ?return x + y;
}
count(3);//3
function count(x, y) {
?? ?x = x??0;
?? ?y = y??0;
?? ?return x + y;
}
count(3);//3ES6寫法:
ES6的寫法簡潔易讀,能夠讓其他開發(fā)者快速了解參數(shù)類型,是否可省等信息,也不會對函數(shù)體代碼造成過多負擔,有利于后期優(yōu)化重構(gòu)
function count(x = 0, y = 0) {
?? ?return x + y;
}
count(3);注意事項:
1.使用默認參數(shù),在函數(shù)體內(nèi)不能重新命名同名變量
function count(x = 0, y = 0) {
?? ?let x;//報錯
?? ?const y;//報錯
}參數(shù)默認值不是傳值的,而是每次都重新計算默認表達式的值,也就是說參數(shù)默認值是惰性求值的
let num = 1;
function count(x = num + 1, y = 0) {
?? ?return x;
}
count();//2
num = 99;
count();//100參數(shù)也可以作為默認值,但是要注意順序
正確示例:
function fn(x = 10, y = x) {
?? ?console.log(x, y);
}
fn(20);//20 20
fn();//10 10錯誤示例:
function fn(x = y, y = 10) {
?? ?console.log(x, y);
}
fn();//報錯參數(shù)默認值為變量時,如果外部作用域有對應(yīng)變量,那么這個參數(shù)就會指向外部變量(即參數(shù)的值等于外部變量的值)
let w = 10;
function fn(x = w) {
?? ?let w = 20;
?? ?return x;
}
fn();//10注意:
//在()階段,x已經(jīng)賦值后,再改變w的值,也無法改變x的值
let w = 10;
function fn(x = 2) {
?? ?w = 20;
?? ?return x;
}
fn();//10reset參數(shù)
ES6引入reset參數(shù)(形式為…變量名),用于獲取函數(shù)的多余參數(shù),這樣就不需要使用arguments對象了
reset參數(shù)搭配的變量是一個數(shù)組,該變量將多余的參數(shù)放入數(shù)組中
類似解構(gòu)賦值,以后就不用call來使arguments調(diào)用數(shù)組方法了
function count(...values) {
?? ?console.log(values);//[2, 5, 3]
?? ?return values.reduce((acc,curr) => acc + curr);
}
add(2, 5, 3);//10reset參數(shù)必須作為函數(shù)最后一個參數(shù)
function count(...value, a){}//報錯name屬性
函數(shù)的name屬性,返回該函數(shù)的函數(shù)名
function count(){}
console.log(count.name); //"count"
(new Function).name // "anonymous"
function foo() {};
foo.bind({}).name // "bound foo"
function foo() {};
foo.bind({}).name // "bound foo"
(function(){}).bind({}).name // "bound " // "bound "
(function(){}).name // ""箭頭函數(shù)
ES6中規(guī)定可以使用“箭頭”(=>)定義函數(shù)
------------正常函數(shù)-------------
function count(x, y) {
?? ?return x + y;
}
------------箭頭函數(shù)-------------
let count =(x, y) => x + y;函數(shù)體中可以直接書寫表達式
let count = (x, y) => {
?? ?y = 100;
?? ?x = x * y;
?? ?return x + y;
}
count(3, 4);//400()中書寫表達式,書寫多個短語語句,最后一個“,”之后的值為返回值
let count = (x, y) => (x = 100, y = 10, x + y); count(3, 4);//110
{}中書寫多行語句
//報錯 會將{}識別為函數(shù)體
let count = id => {id: id, name: "yunjin"};
//不會報錯
let count = id => ({id: id, name: "yunjin"});
到此這篇關(guān)于JavaScript ES6的函數(shù)拓展的文章就介紹到這了,更多相關(guān)JavaScript ES6 函數(shù) 內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
ES6初步了解原始數(shù)據(jù)類型Symbol的用法
ES6中為我們新增了一個原始數(shù)據(jù)類型Symbol,大家是否知道Symbol可以作用在哪?用來定義對象的私有變量如何寫入對象,本文對ES6 Symbol的用法介紹的非常詳細,需要的朋友參考下吧2023-10-10
javascript實現(xiàn)的一個帶下拉框功能的文本框
這篇文章主要介紹了javascript實現(xiàn)的一個帶下拉框功能的文本框,需要的朋友可以參考下2014-05-05
javascript add event remove event
javascript事件綁定和刪除功能代碼2008-04-04

