技術標籤：筆記javascript

js輸出

輸出方式

• window.alert() 瀏覽器彈出的警告框
• document.write() 寫到HTML文件中
• innerHTML 寫到html元素中
• console.log() 寫到瀏覽器控制檯

程式碼示例

警告框

window.alert("這是警告框");

寫入html文件中

document.write("<p style='color: red;'> document.write</p>");

寫入html元素中

document.getElementById("text"
 
).innerHTML="<p style='color: red;'> document.write</p>";

諸如window.alert()的函式window可省略
document.write()和innerHTML作用都是寫入一個html語句，區別在於document.write()是將語句寫入整個HTML文件中，而innerHTML需要獲取指定的元素然後將語句寫入元素中

js語句與註釋

JavaScript語句識別符號

var、let、if、for等稱為語句識別符號

var和let都用做變數的宣告，區別在於var具有宣告提升，let不具有

function函式也具有宣告提升
宣告提升是指變數或者函式在任何位置宣告，都可以在做在程式碼的最前面宣告，即程式碼順序不會影響變數或者函式的呼叫

程式碼塊

如函式

function x(){
	var a = 1;
	var b = 1;
}

在呼叫此函式時整段程式碼全部執行，該段程式碼稱作一個程式碼塊

註釋

//這是單行註釋
/*
 * 這是多行註釋
*/

js資料型別

• 字串(String)
• 數字(Number)
• 布林(Boolean)
• 陣列(Array)
• 物件(Object)
• 空(Null)
• 未定義(Undefined)

陣列

//陣列
var a = new Array();//宣告一個大小為0的陣列
var
 
 b = new Array(2);//宣告一個大小為2的陣列
			
//給陣列賦值可以隨意給定索引，中間未賦值的索引會空出
a[0]="1";
a[3]="2";
b[3]="1";
			
//在js中陣列和物件時互通的，當給定字串作為索引時，會以鍵值對的形式存入
b['a']="x";
			
//建立陣列同時初始化物件
var c = ["1","3"];
var d = new Array("1","2","3");
			
console.log(a);
console.log(b);
console.log(c);
console.log(d);

1. 陣列的大小沒有限定，即使設定了初始化大小也是可以改變的
2. 陣列和物件是可以相互轉換的，當陣列索引是字串時，就對應了物件中的鍵值對

物件

//物件
var student={
	id:1,
	name:"張三",
	age:18,
}
//通過鍵值對的方式儲存
console.log(student);
console.log(student.age);
console.log(student["name"]);

1. 通過鍵值對的方式儲存資料
2. 可以通過物件名.屬性或者**物件名[屬性]**來通過鍵獲取值，鍵相當於索引

空和未定義

//空和未定義
var a;
console.log(a);
a = null;
console.log(a);

undifined表示只是被聲明瞭，此處應該有值只是還沒有定義

1. 變數被聲明瞭但沒有定義
2. 函式被呼叫了但還沒有提供引數，該引數為undifined
3. 物件中還沒有賦值的屬性
4. 無返回值的函式，預設返回undifined

null表示定義了值不過該值為空值
可作為函式的引數使用，表示該函式的引數不是物件型別

變數

1. 變數必須以字母、_、$開頭，但不推薦使用 $和 _
2. 變數的命名大小寫敏感

函式

定義

函式是由事件驅動的或者當它被呼叫時執行的可以重複使用的程式碼塊（函式具有宣告提升）

宣告方式

• function x(){}
• var x = function(){}匿名函式

//普通函式
function x(){
	console.log(1);
}
x();
//匿名函式
var y = function(){
	console.log(2);
}
y();

return值

//return值
function z(){
	return 2;
}
var a = z();
console.log(a);

建構函式

//建構函式
function Student(id,name,age){
	this.id = id;
	this.name = name;
	this.age = age;
	this.sayHi = function(){
		alert("Hi");
	}
};
var s = new Student(1,"張三",18);
s.sayHi();
console.log(s);

1. 建構函式的命名一般首字母大寫
2. 建構函式的作用是新建一個物件
3. 建構函式需要new 函式名()來呼叫，這個函式名也是該物件的類名
4. 建構函式內部用this來構造屬性和方法
5. 建構函式會建立一個新物件並且返回，而普通函式在沒有返回值的時候會返回undifined

運算子

算術運算子

• 賦值運算子 =、+=、-=等
• 算數運算子+、-、*、/等（弱型別，定義了a=1也可以給a賦值為1/3）
• 字串的+運算（與java相同，直接連線）

邏輯運算子

小於、大於、等於、絕對等於、不等於、與、或

等於與絕對等於

//等於和絕對等於
var a = 1;
console.log(a=="1");
console.log(a==="1");
//不等於絕對不等
console.log(a!="1");
console.log(a!=="1");

==會忽略資料型別，僅僅比較值是否相同
===比較資料型別和值是否都相同

條件語句

if語句和switch語句

switch

var a=1;
switch(a){
	case 5:
	console.log(1);
	break;
	case 2:
	console.log(2);
	break;
	default:
	console.log("null");
	break;
}

當所有case都不滿足時執行default下的程式碼塊