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交互
DOM文檔對象模型(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>標簽。
2.使用外部JavaScript文件。
希望多個頁面中運行JavaScript實現相同效果,通常使用外部文件為.js的文件。
如何引用.js為擴展名的文件:
<script src=”../1.js”></script>
注意:外部文件不能包含<script></script>
3.直接在HTML標簽中
<input name='btn' type=”button” value=”彈出消息框” onclick=”javascript:alert(“歡迎你”);”/>
三.JavaScript核心語法
1.變量的聲明和賦值
變量的聲明只有用var,變量的命名規范和Java類似。Var num=1;
在JavaScript中變量可以不用聲明就可以直接使用,但是不推薦這種用法。
2.數據類型
Undefined(未定義類型)
Null(空類型)
Number(數字類型)
String(字符串類型)
Boolean(布爾類型)
3.undefined和null的區別
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[1]=2;
03.var num=[‘1','2'];
數組的常用方法和屬性
Length:設置或返回數組中元素的數目
Join():把數組的所有語速放入一個字符串,通過分割符進行分割。
Sort():對數組進行排序
Push():向數組末尾添加一個或更多元素,並放回新的長度。
<script type="text/javascript">
//01.方式一:創建數組,並給數組賦值
// var fruit = new Array('apple', 'orange', 'peach', 'bananer');
//02.方式二:先創建數組,後通過下標給數組賦值
var fruits = new Array(4);
fruits[0] = 'apple';
fruits[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]);
}
</script>
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基礎教程——入門必看篇就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持。