1. 程式人生 > >JavaScript中return的用法

JavaScript中return的用法

 

這裡是修真院前端小課堂,每篇分享文從

【背景介紹】【知識剖析】【常見問題】【解決方案】【編碼實戰】【擴充套件思考】【更多討論】【參考文獻】

八個方面深度解析前端知識/技能,本篇分享的是:

【JavaScript中return的用法 】

大家好,我是IT修真院北京分院第23期學員。今天主要整理一下return的用法。

JavaScript return 語句,表示從被調函式返回到主調函式繼續執行,返回時可附帶一個返回值,由return後面的引數指定。return通常是必要的,因為函式呼叫的時候計算結果通常是通過返回值帶出的。如果函式執行不需要返回計算結果,也經常需要返回一個狀態碼來表示函式執行的順利與否(-1和0就是最常用的狀態碼),主調函式可以通過返回值判斷被調函式的執行情況。

return返回值的作用就是把固定不變的,常用的程式碼封裝起來寫在類裡,每次用到的時候就呼叫就行了。

先來簡單總結一下renturn的實際使用。

1. return 語句會終止函式的執行並返回函式的值。

寫一個button觸發onclick事件

function demo1() {

return1;

document.write(' <div class="print-result">'+"demo1"+'</div>');

}

 

在return的時候,函式值等於1,後續程式碼不會再執行,不會有後續輸出。

function demo2() {

function a(b,c) {

return b+c;

document.write('<div class= "print-result">'+ (b+c) +'</div>');

}

var abc=a(5,80);

alert(abc);

}

呼叫abc這個變數的時候,它的值會是85;如果想直接輸出結果,不要返回值那就刪除掉return b+c,這樣abc是沒有值的,但是網頁會輸出85。

也可以說預設函式是沒有返回值的。通常函式經過一系列處理後需要給外部返回一個值或者物件,如

function demo3() {

function sum(a,b){

returna+b

}

alert(sum(1,2));

}

這個時候alert顯示的值是3,而如果去掉return,則會返回undefined。

2. 基於函式返回值的應用

return在終止函式執行時的應用:為事件處理函式返回return:false; ,作用在於阻止預設事件行為和取消預設動作,如

<a href ="一個網址"  onclick= “return demo4()”>demo4</a>

為它新增一個return值

function demo4() {return false;}

這樣點選連結就不會跳轉

以上就是return的常見用法,此時有一個比較常見的問題,即:若在for迴圈中使用了return,還會執行下一次迴圈嗎?

function demo5() {

for(var i=1; ;i++) {

console.log(i+"A");

return;

console.log(i+"B");}

console.log(i+"C");}

由於出現return,函式直接終止執行並且返回當前值,所以這段函式的輸出值只有1A。

所以,如下函式,

function demo6() {

function counter() {

for(var count=1; ;count++) {

console.log(count+"A");

if(count===5) {return;}

console.log(count+"B");}

console.log(count+"C");}

counter();}

輸出值是1A,1B,2A,2B,3A,3B,4A,4B,5C。

除了return,還有其他可以讓for迴圈中斷的方式。

1.break

break語句會使執行的程式立刻退出包含在最內層的迴圈或者退出一個switch語句。由於它是用來退出迴圈或者switch語句,所以只有當它出現在這些語句時,這種形式的break語句才是合法的。如果一個迴圈的終止條件非常複雜,那麼使用break語句來實現某些條件比用一個迴圈表示式來表達所有的條件容易得多。

2. continue

continue語句和break語句相似。所不同的是,它不是退出一個迴圈,而是開始迴圈的一次新迭代。要注意的是continue語句只能用在while語句、do/while語句、for語句、或者for/in語句的迴圈體內,在其它地方使用都會引起錯誤。

參考文獻

1. http://www.jb51.net/article/24101.htm

2. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/return

3. 紅寶書

相關PPT可見:https://ptteng.github.io/PPT/PPT/js-01-return%E7%9A%84%E7%94%A8%E6%B3%95.html#/

以及騰訊視訊:https://v.qq.com/x/page/k0520zb48dg.html

問題整理:

1. i++和++i的區別

++i使用的是前置運算,先賦值再運算,i++使用的是後置運算,先運算再賦值,詳見紅寶書

2. 關於閉包

閉包:當function裡巢狀function時,內部的function可以訪問外部function裡的變數。當return的是內部function時,就是一個閉包。內部function會close-over外部function的變數直到內部function結束。

3. 迭代的含義

迭代是重複反饋過程的活動,其目的通常是為了逼近所需目標或結果。每一次對過程的重複稱為一次“迭代”,而每一次迭代得到的結果會作為下一次迭代的初始值,for迴圈就是迭代的一種



作者:AmaYang
連結:https://www.jianshu.com/p/36cfd0ea95e0
來源:簡書
簡書著作權歸作者所有,任何形式的轉載都請聯絡作者獲得授權並註明出處。

更多內容,可以加入IT交流群565734203與大家一起討論交流

這裡是技能樹·IT修真院:https://www.jnshu.com,初學者轉行到網際網路的聚集地