JavaScript基礎教學—入門必看篇

JavaScript他是一種描述性語言，其實他並不難學，只要用心學，一定會學好，我相信大家在看這篇文章的時候，一定也學過HTML吧，使用JavaScript就是為了能和網頁有更好的交互，下面切入主題。    

一. JavaScript

1.什麼是JavaScript

JavaScript是一種描述性語言，也是一種基於物件（Object）和事件驅動（Event Driven）的，並具有安全性的腳本語言。

2.JavaScript的特點

JavaScript主要用來在HTML頁面上加入互動行為。

JavaScript是一種腳本語言，語法和Java類似。

javaScript一般用來編寫客戶端的腳本。

JavaScript是一種解釋性語言。

3.JavaScript的組成

ECMScript標準（規定所有屬性，方法和物件的標準）

BOM瀏覽器物件模型（Browser Object Model）：與HTML互動

DOMObject 物件模型（Document Object Model）：與HTML互動

DOMObject）：Document Object Model）：存取與操縱HTML文件

4.JavaScript基本結構

<script language=”javascript” type=”text/javascript”>
 
</script>
 
Language=”javascript”用来表示使用的语言是javascript

5.JavaScript執行原理

1. 瀏覽器客戶端向伺服器端發送請求。 (使用者在瀏覽器網址列輸入的位址)

2.資料處理:伺服器端將某個包含javaScript的頁面進行處理。

3.發送回應：伺服器端將含有javascript的HTML檔案進行處理頁面傳送到瀏覽器用戶端，然後由瀏覽器用戶端從上直下逐條解析HTML標籤和JavaScript標籤，將頁面效果呈現給使用者。

二．在網頁中引入JavaScript的方式

1.使用<script>標籤。 </script>

2.使用外部JavaScript檔案。

希望在多個頁面中運行JavaScript實現相同效果，通常使用外部檔案為.js的檔案。

如何引用.js為副檔名的檔案：

注意：外部檔案不能包含<script></script>

3.直接在HTML標籤中

<input name=&#39;btn&#39; type=”button” value=”弹出消息框” onclick=”javascript:alert(“欢迎你”);”/>

三.JavaScript核心語法

1.變數的聲明和賦值

變數的聲明只有用var，變數的命名規格和Java類似。 Var num=1；

在JavaScript中變數可以不用宣告就可以直接使用，但不推薦這種用法。

2.資料型別

Undefined(未定義型別)

Null(空白型別)

Number(數字型別)

String(字串型別)

Boolean(olean)

String(字串型別)

Boolean(olean(olean)(Boolean(Il)的區別

null 表示"沒有物件"，即該處不應該有值。典型用法是：

（1） 作為函數的參數，表示函數的參數不是物件。

（2） 作為物件原型鏈的終點。

Object.getPrototypeOf (Object.prototype)// null

undefined 表示"缺少值"，就是此處應該有一個值，但是還沒有定義。典型用法是：

（1）變數被宣告了，但沒有賦值時，就等於 undefined。

（2) 呼叫函數時，應該提供的參數沒有提供，該參數等於 undefined。

（3）物件沒有賦值的屬性，該屬性的值為 undefined。

（4）函數沒有傳回值時，預設回傳 undefined。

4.只有6種情況，判定結果為假。

null,false,undefined,0,"",NaN

5.字串的一些常用方法

toString();傳回字串

toLowerCasee()；把字串裝換小寫。

toUpperCase();把字串轉換成大寫

charAt(index);傳回在指定位置的字串

indexOf(str,index);找出某個指定的字串在字串中首次出現的位置

Substring(index,index);傳回位於指定索引index1和index2之間的字串（包括index1不包括index2）

Split(str);將字串分割為字元陣列

6.建立陣列並為陣列賦值的三種方式

01. Var num=('1','2');

02.var num=new Array(2);

Num[0]=1;

Num[111 ]=2;

03.var num=['1','2'];

數組的常用方法和屬性

Length：設定或傳回數組中元素的數量

Join():把數組的所有語速放入一個字串，透過分割符進行分割。

Sort():對陣列進行排序

Push():在陣列末尾新增一個或更多元素，並放回新的長度。

//01.方式一：建立陣列,並給予陣列賦值

// var fruit = new Array('apple', 'orange', 'peach', 'bananer');

//02.方式二：先建立數組，然後再下標給數組賦值

var fruits = new Array(4);

fruits[0] = 'apple';

[1] = 'orange';

fruits[2] = 'peach';

fruits[3] = 'bananer';

//03方式三：和方式一類似只不過改變了符號

/ /var fruitss = new Array['apple', 'orange', 'peach', 'bananer'];

//04.存取陣列中下標為3的資料🎜🎜document.write(fruits[0]) ;🎜

//05通过数组的join方法把元素放到字符串中并用指定分隔符进行分割

var result = fruits.join(',');

//06通过sort方法对数组进行排序

fruits.sort();

//06.向末尾添加一个或多个元素，最后返回该数组的新长度

var length= fruits.push('wert','foot');

document.write('\n' + length);

//07.遍历数组

for(var item in fruits)

       {

 alert(fruits[item]);

       }

7.运算符

8 程序调试

方案一：在VS中调试

步骤：01.将要调试的页面设置成起始页

02.设置断点

03.按F5启动调试

方案二：chrome浏览器调试

步骤：01.点击F12，将工具调出

02.设置断点

03.刷新页面

方案三：IE浏览器

步骤：01.F12，开发人员工具

02.切到脚本选项卡

03.设置断点

04.启动调试

 05.刷新

四.JavaScript中的函数

1.常用的系统函数

01.   parseInt（“字符串”）；

parseInt（）函数首先查看位置为0处的字符，判断他是否为一个有效数字，如果不是则返回NaN，不在执行其他操作，但如果该字符是有效参数，则该函数将查看位置为1处的字符，进行同样的测试，这一过程将持续到发现该字符是有效字符为止，此时该字符将之前的字符串转换成数字。

eg：

var num1=parseInt(“78.9”)//返回值为78

var num2=parseInt(“afa78.9”)//返回值为NaN

02.parseFloat（“字符串”）；

他的用法和parseInt类似，只不过字符串中出现的第一个点将被认为是有效字符.

eg:

var num1=parseInt(“78.9”)//返回值为78

var num2=parseInt(“afa78.9”)//返回值为NaN

2.自定义函数

在JavaScript中，自定义函数是由function,函数名，一组以参数以及置于括号中待执行的JavaScript语句组成。

下面来看一看语法：

function 函数名(参数1，参数2,..)

{

//JavaScript语句

[return 返回值]

}

function是定义函数的关键字，必须有。

参数1，和参数2是该函数的参数，因为JavaScritp他本省的类型是弱类型，所有在给定参数时没有必要提供类型

{}定义的函数的开始和结尾.

return 语句用来规定函数返回的值.

2.调用函数

要执行一个函数，首先肯定要调用这个函数，必须制定函数名和其后的参数。

eg：

<script type=”text/javascript”>
 
function show(){
 
 
 
}
 
show();
 
</script>

3.匿名函数

匿名函数就是没有名字的函数了，也叫闭包函数(closures),允许 临时创建一个没有指定名称的函数。最经常用作回调函数(callback)参数的值，很多新手朋友对于匿名函数不了解。这里就来分析一下。

function 函数名(参数列表){函数体;}

如果是创建匿名函数，那就应该是：

function(){函数体;}

因为是匿名函数，所以一般也不会有参数传给他。

为什么要创建匿名函数呢？在什么情况下会使用到匿名函数。匿名函数主要有两种常用的场景，一是回调函数，二是直接执行函数。

eg：

<script language="javascript">
var a = "a";
(function(){
  var a="b";
  alert(a);
})();
alert(a);
</script>

在上面这段代码中，会顺序输出两个alert框。第一个alert框内容为b，第二个为a。以为该Script标签中有一个匿名方法时自调用的，所有首先弹出b，然后碰到匿名方法后的alert（a）则弹出a。

以上这篇JavaScript基础教程——入门必看篇就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持PHP中文网。

更多JavaScript基礎教學—入門必看篇相关文章请关注PHP中文网！