JavaScript基礎學習(一)

值類型(基本類型):字符串(String)、數字(Number)、布爾(Boolean)、對空(Null)、未定義(Undefined)、Symbol。javascript

注:Symbol 是 ES6 引入了一種新的原始數據類型,表示獨一無二的值。php

引用數據類型:對象(Object)、數組(Array)、函數(Function)。html

js中  var name="Volvo XC60";        var name='Volvo XC60';    '  '  與 " " 做用是相同的  java

=== 爲絕對相等,即數據類型與值都必須相等。

JavaScript 數組

下面的代碼建立名爲 cs 的數組:正則表達式

var cs=new Array();
cs[0]="Saab";
cs[1]="Volvo";
cs[2]="BMW";

或者 (condensed array):數組

var cs=new Array("Saab","Volvo","BMW");

或者 (literal array):  例;var cs=["Saab","Volvo","BMW"];瀏覽器

JavaScript 對象

對象由 {  } 分隔。在括號內部,對象的屬性以名稱和值對的形式 (name : value) 來定義。函數

屬性由逗號分隔:    var test={name:"John", three:"Doe", id:666};測試

對象有兩種尋址方式
1.name=test.name;         2.name=test["name"];
兩種方式訪問對象屬性:
1.test.name;              2.test["name"];

 

 "JavaScript 對象是變量的容器"。可是,咱們一般認爲 "JavaScript 對象是鍵值對的容器"。this

鍵值對一般寫法爲 name : value (鍵與值以冒號分割)。鍵值對在 JavaScript 對象一般稱爲 對象屬性

 

一般 fullName() 是做爲 person 對象的一個方法, fullName 是做爲一個屬性。

若是使用 fullName 屬性,不添加 (), 它會返回函數的定義(函數表達式);添加括號輸出函數執行結果

document.getElementById("demo1").innerHTML = "不加括號輸出函數表達式:" + person.fullName;           不加括號輸出函數表達式:function() { return this.firstName + " " + this.lastName; }
document.getElementById("demo2").innerHTML = "加括號輸出函數執行結果:" + person.fullName();     加括號輸出函數執行結果:test  java

 

局部 JavaScript 變量

在 JavaScript 函數內部聲明的變量(使用 var)是局部變量,因此只能在函數內部訪問它。(該變量的做用域是局部的)。

全局 JavaScript 變量

在函數外聲明的變量是全局變量,網頁上的全部腳本和函數都能訪問它。

JavaScript 變量的生存期

JavaScript 變量的生命期從它們被聲明的時間開始。

局部變量會在函數運行之後被刪除。

全局變量會在頁面關閉後被刪除。

 

非嚴格模式下給未聲明變量賦值建立的全局變量,是全局對象的可配置屬性,能夠刪除。

var var1 = 1; // 不可配置全局屬性 var2 = 2; // 沒有使用 var 聲明,可配置全局屬性 console.log(this.var1); // 1 console.log(window.var1); // 1 console.log(window.var2); // 2 delete var1; // false 沒法刪除 局部變量沒法被刪除 console.log(var1); //1 delete var2; //全局屬性能夠被刪除 console.log(delete var2); // true 已經刪除 console.log(var2); // 已經刪除 報錯變量未定義

JavaScript 做用域

在 JavaScript 中, 做用域爲可訪問變量,對象,函數的集合

局部變量:只能在函數內部訪問。 函數參數只在函數內起做用,是局部變量。

全局變量有 全局做用域: 網頁中全部腳本和函數都可使用。 

在 HTML 中, 全局變量是 window 對象: 全部數據變量都屬於 window 對象。

若是變量在函數內沒有聲明(沒有使用 var 關鍵字),該變量爲全局變量。

JavaScript 變量生命週期

JavaScript 變量生命週期在它聲明時初始化。

局部變量在函數執行完畢後銷燬。

全局變量在頁面關閉後銷燬。

你的全局變量,或者函數,能夠覆蓋 window 對象的變量或者函數。

局部變量,包括 window 對象能夠覆蓋全局變量和函數。

注:Window 對象表示瀏覽器中打開的窗口

 

常見的HTML事件的列表:

 

JavaScript 字符串用於存儲和處理文本。

在JavaScript 中,字符串寫在單引號或雙引號中;

下表中列舉了在字符串中可使用轉義字符轉義的特殊字符:

 

字符串屬性和方法

屬性:        描述:

constructor        返回建立字符串屬性的函數

length     返回字符串的長度

prototype        容許您向對象添加屬性和方法

字符串方法:

方法 描述
charAt() 返回指定索引位置的字符
charCodeAt() 返回指定索引位置字符的 Unicode 值
concat() 鏈接兩個或多個字符串,返回鏈接後的字符串
fromCharCode() 將 Unicode 轉換爲字符串
indexOf() 返回字符串中檢索指定字符第一次出現的位置
lastIndexOf() 返回字符串中檢索指定字符最後一次出現的位置
localeCompare() 用本地特定的順序來比較兩個字符串
match() 找到一個或多個正則表達式的匹配
replace() 替換與正則表達式匹配的子串
search() 檢索與正則表達式相匹配的值
slice() 提取字符串的片段,並在新的字符串中返回被提取的部分
split() 把字符串分割爲子字符串數組
substr() 從起始索引號提取字符串中指定數目的字符
substring() 提取字符串中兩個指定的索引號之間的字符
toLocaleLowerCase() 根據主機的語言環境把字符串轉換爲小寫,只有幾種語言(如土耳其語)具備地方特有的大小寫映射
toLocaleUpperCase() 根據主機的語言環境把字符串轉換爲大寫,只有幾種語言(如土耳其語)具備地方特有的大小寫映射
toLowerCase() 把字符串轉換爲小寫
toString() 返回字符串對象值
toUpperCase() 把字符串轉換爲大寫
trim() 移除字符串首尾空白
valueOf() 返回某個字符串對象的原始值

JavaScript運算符

運算符 = 用於給 JavaScript 變量賦值。

算術運算符 + 用於把值加起來。

y=5:

運算符 描述 例子 x 運算結果 y 運算結果
+ 加法 x=y+2 7 5
- 減法 x=y-2 3 5
* 乘法 x=y*2 10 5
/ 除法 x=y/2 2.5 5
% 取模(餘數) x=y%2 1 5
++ 自增 x=++y 6 6
x=y++ 5 6
-- 自減 x=--y 4 4
x=y-- 5 4

JavaScript 賦值運算符。

賦值運算符用於給 JavaScript 變量賦值。

給定 x=10  y=5,下面的表格解釋了賦值運算符:

運算符 例子 等同於 運算結果
= x=y   x=5
+= x+=y x=x+y x=15
-= x-=y x=x-y x=5
*= x*=y x=x*y x=50
/= x/=y x=x/y x=2
%= x%=y x=x%y x=0

用於字符串的 + 運算符

+ 運算符用於把文本值或字符串變量加起來(鏈接起來)。

如需把兩個或多個字符串變量鏈接起來,請用 + 運算符。

對字符串和數字進行加法運算

兩個數字相加,返回數字相加的和,若是數字與字符串相加,返回字符串,

x=5+5;
y="5"+5;
z="Hello"+5;

x,y, 和 z 輸出結果爲:

10
55
Hello5

JavaScript 比較 和 邏輯運算符

比較和邏輯運算符用於測試 true 或者 false

比較運算符

比較運算符在邏輯語句中使用,以測定變量或值是否相等。

<p給定x=5,下面的表格解釋了比較運算符:

如何使用

能夠在條件語句中使用比較運算符對值進行比較,而後根據結果來採起行動:

if (age<18) x="Too young";

邏輯運算符

邏輯運算符用於測定變量或值之間的邏輯。

給定 x=6 以及 y=3,下表解釋了邏輯運算符:

條件運算符

JavaScript 還包含了基於某些條件對變量進行賦值的條件運算符。

<p> 點擊按鈕判斷年齡。</p>
年齡:<input id="age" value="18"/>
<p>是否達到投票年齡?</p>
<button onclick="myFunction01()">點擊按鈕</button>
<p id="demo01"></p>
<script>
function myFunction01(){
	var age,voteable;
	age=document.getElementById("age").value;
	window.alert(voteable=(age<18)?"年齡不足":"年齡已達到");
	document.getElementById("demo01").innerHTML=voteable;
}
</script>

  

 JavaScript多元運算符

p>1?p<b?p>b:p=6:p=3 p>1? 總體 :p=3

一、當 p>1 時返回 p<b?p>b:p=6

  • 1.一、當 p<b 時返回 p>b
  •  1.二、當 p>=b 時返回 p=6

二、當 p<=1 是返回 p=3 因此先執行 1

三、實例中當 p=9 的時候,返回 p<b?p>b:p=6 接着執行 1.1,當 p=9<12 時,返回 p>b,即 9>12,條件不成立因此最終結果爲 false。

 

JavaScript 中有三種邏輯運算符:

 

1. 取反 !

 

首先把數據轉化爲布爾值,而後取反,結果爲 true 或 false。

 

<script type="text/javascript"> var a = [1,2,3]; var b = "hello"; var obj = new Object(); var d; console.log(!""); //true console.log(!d); //true console.log(!a); //false console.log(!b); //false console.log(!obj); //false </script>

 

2. 邏輯與 &&

 

JavaScript 中邏輯與和其餘語言不太同樣,若是第一個操做數是 true(或者可以轉爲 true),計算結果就是第二個操做數,

若是第一個操做數是 false,結果就是 false(短路計算),對於一些特殊數值不遵循以上規則。

(我的理解爲:若是運算的第一個操做數爲true,則返回第二個操做數,反之則返回第一個操做數)

返回的不是單純的 true 仍是 false,而是具體的值;

如果第一個值轉換布爾值爲 true,就返回第二個值;反之,返回第一個值。

白話說就是:哪一個值是錯的就返回哪一個值,若是都是對的,返回最後一個值。

<script type="text/javascript"> var a = [1,2,3]; var b = "hello"; var obj = new Object(); var d; console.log(true && 10); //第一個操做數是true,結果是第二個操做,也就是10 console.log(false && b); //第一個操做數是false,結果flase console.log(100 && false); //第一個操做數是100,結果flase console.log(undefined && false); //第一個操做數是undefined,結果undefined console.log(NaN && false); //第一個操做數是NaN,結果NaN console.log(null && false); //第一個操做數是null,結果null console.log('' && false); //第一個操做數是空串,結果空串 console.log(0 && 100); //結果是0 console.log(5 && 100); //100 console.log(a && b); //hello console.log(obj && 200); //200 </script>

 

3. 邏輯或 ||

若是第一個操做數不是 false,結果就是第一個操做數,不然結果是第二個操做數。若是第一個操做數可以轉爲 true,

結果就是第一個操做數(我的理解爲:若是運算的第一個操做數爲 true,則返回第一個操做數,反之則返回第二個操做數)

同 && 相似,返回的不是單純的 true 和 false,而是具體的值。

這個是從頭開始,遇到能轉換成 true 的值,就返回那個值,若是沒有 true 的就返回最後一個值。

<script type="text/javascript"> var a = [1,2,3]; var b = "hello"; var obj = new Object(); var d; console.log(true || 10); //第一個操做數是true,結果是第一個操做,也就是true console.log(false || b); //第一個操做數是false,結果是第二個操做數b console.log(100 || false); //第一個操做數是100,結果100 console.log(undefined || 9); //第一個操做數是undefined轉false,結果9 console.log(NaN || false); //第一個操做數是NaN轉false,結果第二個操做數 console.log(null || a); //第一個操做數是null轉false,結果a console.log('' || false); //第一個操做數是空串轉false,結果第二操做數 console.log(0 || 100); //結果是100 console.log(5 || 100); //5 console.log(a || b); //a console.log(obj || 200); //obj </script>

 

 

做者:舊歌
連接:http://www.javashuo.com/article/p-rznwcewe-nx.html
本文版權歸做者和博客園共有,歡迎轉載,但未經做者贊成必須在文章頁面給出原文鏈接,不然保留追究法律責任的權利

相關文章
相關標籤/搜索