jQuery是一個使用JavaScript功能構建的框架。因此，您可以使用JavaScript中的所有功能和其他功能。本章將解釋jQuery中常用的大多數基本概念。

String

JavaScript中的字符串是一個不可變的對象，它不包含任何、一個或多個字符。下面是JavaScript字符串的有效示例−

"This is JavaScript String"
'This is JavaScript String'
'This is "really" a JavaScript String'
"This is 'really' a JavaScript String"

Numbers

JavaScript中的數字是雙精度64位格式IEEE 754值。它們是不可變的，就像字符串一樣。下面是JavaScript數字的有效示例−

5350
120.27
0.26

Boolean

JavaScript中的布爾值可以是true或false。如果數字爲零，則默認爲false。如果空字符串默認爲false。

下面是JavaScript布爾值的有效示例−

true      // true
false     // false
0         // false
1         // true
""        // false
"hello"   // true

Objects

JavaScript非常支持對象概念。您可以使用對象文本創建一個對象，如下所示−

var emp = {
   name: "Zara",
   age: 10
};

您可以使用下面的點符號編寫和讀取對象的屬性;

// Getting object properties
emp.name  // ==> Zara
emp.age   // ==> 10

// Setting object properties
emp.name = "Daisy"  // <== Daisy
emp.age  =  20      // <== 20

Arrays

可以使用數組文字定義數組，如下所示−

var x = [];
var y = [1, 2, 3, 4, 5];

數組有一個length屬性，該屬性對於疊代非常有用−

var x = [1, 2, 3, 4, 5];

for (var i = 0; i < x.length; i++) {
   // Do something with x[i]
}

Functions

JavaScript中的函數可以是命名的，也可以是匿名的。可以使用function關鍵字定義命名函數，如下所示−

function named(){
   // do some stuff here
}

匿名函數可以用與普通函數類似的方式定義，但它不會有任何名稱。

匿名函數可以分配給變量或傳遞給方法，如下所示。

var handler = function (){
   // do some stuff here
}

JQuery經常使用匿名函數，如下所示−

$(document).ready(function(){
   // do some stuff here
});

Arguments

JavaScript變量arguments是一種具有length屬性的數組。下面的例子很好地解釋了它;

function func(x){
   console.log(typeof x, arguments.length);
}

func();                //==> "undefined", 0
func(1);               //==> "number", 1
func("1", "2", "3");   //==> "string", 3

arguments對象還有一個被調用方屬性，該屬性引用您所在的函數。例如−

function func() {
   return arguments.callee; 
}

func();                // ==> func

Context

JavaScript著名關鍵字this總是指當前上下文。在函數中，上下文可以改變，這取決於函數的調用方式−

$(document).ready(function() {
   // this refers to window.document
});

$("div").click(function() {
   // this refers to a div DOM element
});

可以使用函數內置的方法call（）和apply（）指定函數調用的上下文。

它們之間的區別在於它們如何傳遞參數。Call將所有參數作爲參數傳遞給函數，而apply接受數組作爲參數。

function scope() {
   console.log(this, arguments.length);
}

scope() // window, 0
scope.call("foobar", [1,2]);  //==> "foobar", 1
scope.apply("foobar", [1,2]); //==> "foobar", 2

Scope

變量的作用域是程序中定義它的區域。JavaScript變量將只有兩個作用域。

• 全局變量−全局變量具有全局範圍，這意味著它在JavaScript代碼中的任何地方都被定義。

• 局部變量−局部變量僅在定義它的函數中可見。函數參數始終是該函數的本地參數。

在函數體中，局部變量優先於同名的全局變量;

var myVar = "global";     // ==> Declare a global variable

function ( ) {
   var myVar = "local";   // ==> Declare a local variable
   document.write(myVar); // ==> local
}

Callback

回調是作爲參數或選項傳遞給某個方法的普通JavaScript函數。有些回調只是事件，調用它是爲了讓用戶在觸發某個狀態時有機會作出反應。

jQuery的事件系統在任何地方都使用這種回調，例如-minus;

$("body").click(function(event) {
   console.log("clicked: " + event.target);
});

大多數回調提供參數和上下文。在事件處理程序示例中，使用一個參數（事件）調用回調。

有些回調需要返回某些內容，有些則使返回值成爲可選值。爲了防止表單提交，提交事件處理程序可以返回false，如下所示−

$("#myform").submit(function() {
   return false;
});

Closures

每當從某個內部作用域訪問在當前作用域之外定義的變量時，都會創建閉包。

下面的示例演示了如何在create、increment和print函數中看到變量counter，而不是在它們之外−

function create() {
   var counter = 0;
	
   return {
      increment: function() {
         counter++;
      },
	   print: function() {
         console.log(counter);
      }
   }
}

var c = create();
c.increment();
c.print();     // ==> 1

此模式允許您使用對外部世界不可見的數據進行操作的方法創建對象。值得注意的是，數據隱藏是面向對象編程的基礎。

Proxy Pattern

代理是一個對象，可以用來控制對另一個對象的訪問。它實現與這個其他對象相同的接口，並將任何方法調用傳遞給它。另一個物體通常被稱爲真正的主體。

代理可以被實例化來代替這個真實的主題，並允許遠程訪問它。我們可以將jQuery的setArray方法保存在一個閉包中，並按如下方式覆蓋它;

(function() {
   // log all calls to setArray
   var proxied = jQuery.fn.setArray;

   jQuery.fn.setArray = function() {
      console.log(this, arguments);
      return proxied.apply(this, arguments);
   };
	
})();

上面的代碼包裝在一個函數中以隱藏proxied變量。然後，代理記錄對該方法的所有調用，並將調用委託給原始方法。使用apply（this，arguments）可以保證調用方不會注意到原始方法和代理方法之間的差異。

Built-in Functions

JavaScript附帶了一組有用的內置函數。這些方法可用於操作字符串、數字和日期。

以下是重要的JavaScript函數−

Sr.No.	Method & Description
1	字符（） 返回指定索引處的字符。
2	concat（） 組合兩個字符串的文本並返回一個新字符串。
3	forEach（） 爲數組中的每個元素調用函數。
4	索引（） 返回指定值第一次出現的調用字符串對象中的索引，如果找不到則返回-1。
5	長度（） 返回字符串的長度。
6	彈出（） 從數組中刪除最後一個元素並返回該元素。
7	推（） 將一個或多個元素添加到數組末尾並返回數組的新長度。
8	反轉（） 反轉數組元素的順序--第一個成爲最後一個，最後一個成爲第一個。
9	排序（） 對數組的元素進行排序。
10	子字符串（） 返回字符串中從指定位置開始到指定字符數的字符。
11	toLowerCase（） 返迴轉換爲小寫的調用字符串值。
12	toString（） 返回數字值的字符串表示形式。
13	頭殼（） 返迴轉換爲大寫的調用字符串值。

The Document Object Model

文檔對象模型是HTML的各種元素的樹結構，如下所示−

<html>
   <head>
      <title>The jQuery Example</title>
   </head>
	
   <body>
      <div>
         <p>This is a paragraph.</p>
         <p>This is second paragraph.</p>
         <p>This is third paragraph.</p>
      </div>
   </body>
</html>

這將產生以下結果&負;

以下是關於上述樹結構的要點&負;

• <html>是所有其他元素的祖先;換句話說，所有其他元素都是<html>的後代;。

• <head>和<body>元素不僅是<html>的子元素，而且也是其子元素。

• 同樣，除了作爲<head>和<body>的祖先，<html>也是它們的父級。

• <p>元素是<div>的子元素（和子元素）、<body>和<html>的子元素，以及彼此的兄弟元素。

在學習jQuery概念的同時，了解DOM會很有幫助，如果您不了解DOM，那麼我建議您閱讀我們關於DOM教程的簡單教程。