首頁 > web前端 > js教程 > JavaScript基礎教學—入門必看篇

JavaScript基礎教學—入門必看篇

高洛峰
發布: 2017-01-21 09:57:52
原創
1117 人瀏覽過

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>標籤。 </p><p>2.使用外部JavaScript檔案。 </p><p>希望在多個頁面中運行JavaScript實現相同效果,通常使用外部檔案為.js的檔案。 </p><p>如何引用.js為副檔名的檔案:</p><p><script src=”../1.js”></script>

注意:外部檔案不能包含<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():在陣列末尾新增一個或更多元素,並放回新的長度。

7.运算符

JavaScript基礎教學—入門必看篇

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中文网!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板