javascript函數有哪些寫法

本篇內容主要講解“javascript函數有哪些寫法”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實用性強。下面就讓小編來帶大家學習“javascript函數有哪些寫法”吧!

javascript函數的寫法有：1、常規寫法，“function 函數名(){js代碼}函數名()”；2、$(function(){})寫法，“$(對象).ready(function() {js代碼});”。

本教程操作環境：windows7系統、javascript1.8.5版、Dell G3電腦。

Javascript和其他編程語言相比比較隨意，所以Javascript代碼中充滿各種奇葩的寫法，有時霧里看花，本文講一下JavaScript函數的寫法。

在Javascript中只有對象。 變量是對象，函數也是對象。 只要你知道你的對象是什么，按照它的方式去使用就可以了。
Javascript是弱類型，對象，實例，函數，方法通用的。不需要區別那么清楚。

1. 常規寫法：

// 函數的定義
function foo() {
    alert('常規寫法');
}
// 函數的調用
foo()

這種寫法是大家最熟悉，最易于理解的寫法和調用方法，接著往下看

2. 匿名函數寫法

// 函數的定義
var foo = function(){
    alert('匿名函數定義');
}
// 函數的調用
foo()

這里把功能定義弄成了匿名，省去了命名的痛苦，同時賦給了一個變量，變量就成了功能的代名詞，接著看

3. 將方法作為一個對象

// 定義
var test = {
    fun1: function(){  },
    fun2: function(){  }
}
// 調用
test.fun1();
test.fun2();

在Javascript中變量功能很強大，可以代表很多東西。

4. 構造函數中給對象添加方法

// 給對象添加方法
var fun = function(){ };  // 定義函數對象
fun.prototype.test = function(){ 
    alert('這是在在foo函數上的原始對象上添加test方法，構造函數中用到');
}

// 調用
var myfun = new fun(); // 創建對象
myfun.test(); // 調用對象屬性

通過prototype關鍵字添加方法。

5. 自執行函數 ( function(){…} )() 和( function(){…} () )

前面講的函數定義和調用時分開的，這里馬上講的定義和執行是一起進行的。

( function(){…} )() 和( function(){…} () ) 是 兩種javascript立即執行函數的常見寫法，最初我以為是一個括號包裹匿名函數，再在后面加個括號調用函數，最后達到函數定義后立即執行的目的，后來發現加括號的原因并非如此。要理解立即執行函數，需要先理解一些函數的基本概念。

函數聲明、函數表達式、匿名函數

函數聲明：function fnName () {…};使用function關鍵字聲明一個函數，再指定一個函數名，叫函數聲明。

函數表達式 var fnName = function () {…};使用function關鍵字聲明一個函數，但未給函數命名，最后將匿名函數賦予一個變量，叫函數表達式，這是最常見的函數表達式語法形式。

匿名函數：function () {}; 使用function關鍵字聲明一個函數，但未給函數命名，所以叫匿名函數，匿名函數屬于函數表達式，匿名函數有很多作用，賦予一個變量則創建函數，賦予一個事件則成為事件處理程序或創建閉包等等。

函數聲明和函數表達式不同之處在于

一、Javascript引擎在解析javascript代碼時會‘函數聲明提升’（Function declaration Hoisting）當前執行環境（作用域）上的函數聲明，而函數表達式必須等到Javascirtp引擎執行到它所在行時，才會從上而下一行一行地解析函數表達式，

二、函數表達式后面可以加括號立即調用該函數，函數聲明不可以，只能以fnName()形式調用 。以下是兩者差別的兩個例子。

// 方式1： ( function(){…} () )
(
     function(){alert('hello world, I am coming');}()
);
// 函數有參數的情況，有時為確保執行，前面加;
// 看到別人的插件，你會發現人家開頭處加了一個";"，這樣就算頁面js有錯誤，加載運行他的插件也能保證運行，如：
;(function(e){alert(e);}('hello world'));

// 方式2：( function(){…} )()
(function(){alert('hello');})();

// 有時在前面加運算符，常見的是!與void
!function(){alert('hello');}();
void function(){alert(2);}();

6 $(function(){})寫法

$ (function(){/…/});是 $(document).ready(function(){/…/})的簡寫形式，是在DOM加載完成后執行的回調函數，并且只會執行一次。

$( document ).ready(function() {
   console.log( "ready!" );
});

與如下寫法等價

$(function() {
   console.log( "ready!" );
});

在一個頁面中不同的js中寫的$(function(){/…/});函數，會根據js的排列順序依次執行。

到此，相信大家對“javascript函數有哪些寫法”有了更深的了解，不妨來實際操作一番吧！這里是億速云網站，更多相關內容可以進入相關頻道進行查詢，關注我們，繼續學習！