Web前端學習總結第四周

羅裡巴所發表於2020-11-05

Web前端學習總結第四周

JavaScript

一、陣列

1、陣列的建立

(1)利用new建立
var arr = new Array();//建立新的空陣列
(2)利用陣列字面量建立
var arr = [];//建立新的空陣列,陣列中的元素用逗號隔開

Javascript中的陣列可以儲存任何資料型別的元素,和C語言還是有區別的。

2、陣列的遍歷

var arr = [];
for (var i = 0;i < arr.length;i++){
	console.log(arr[i]);
}

3、增加陣列元素

(1)修改陣列長度

可以通過修改length長度來實現陣列擴容的目的,length的屬性是可讀寫的,如果擴充出來的空間為空,預設值為undefined。

(2)修改陣列索引

直接修改陣列索引的值來直接新增陣列元素,例如:

var arr = [1, 2, 3];
arr[3] = 4;
arr[4] = 5;

這樣可以直接新增陣列元素。

4、修改陣列的一些方法

(1)篩選陣列中需要的元素
var arr = [包含多個資料];
var newArr = [];
for (var = i;i < arr.length;i++){
	if(條件表示式){
		newArr[arr.length] = arr[i];
	}
}
(2)翻轉陣列
var arr = [包含多個資料];
var newArr = [];
for (var = arr.length - 1;i >= 0;i--){
	newArr[arr.length] = arr[i];
}
(3)氣泡排序
var arr = [包含多個資料];
for (var = 0;i <arr.length - 1;i++){
	for (var j=0;j < arr.length - i - 1;j++){
		if(arr[j] < arr[j+1]){
			var temp = arr[j];
			arr[j] = arr[j+1];
			arr[j+1] = arr[j];
		}
	}
}

二、函式

1、函式的宣告

(1)命名函式
function 函式名(){
	//函式體;
}
函式名();//呼叫方法
(2)匿名函式
var 變數名 = function(){
	//函式體;
}
變數名();//呼叫方法

2、函式的引數

在宣告函式時,可以在函式名稱後面的小括號中新增一些引數,這些引數被稱為形參,而在呼叫該函式時,同時也需要傳遞相應的引數,這些引數被稱為實參。和C中的語法基本一致。

引數說明
形參形式上的引數,函式定義的時候,傳遞的引數,當前並不知道是什麼
實參實際上的引數,函式呼叫的時候,傳遞的引數,實參是傳遞給形參的

形參和實參個數不匹配的問題

引數個數說明
實參個數等於形參個數輸出正確結果
實參個數多於形參個數只取到形參的個數
實參個數少於形參個數多的形參定義為undefined,結果為NaN

3、函式的返回值

function 函式名(){
	return 需要返回的結果;
}
函式名();

函式只是實現某種功能,最終的結果需要返回給函式的呼叫者函式名(),通過return實現的。return需要注意的一些事項:

  • return會終止函式
  • return只會返回一個值
  • 函式沒有return就會返回undefined

4、arguments的使用

當不確定有多少個引數傳遞的時候,可以用arguments來獲取,所有函式都內建了一個arguments物件,arguments物件中儲存了傳遞的所有實參。
arguments展示形式是一個偽陣列,因此可以遍歷,而且具有一下特徵:

  • 具有length屬性
  • 按索引方式儲存資料
  • 不具有陣列的push,pop等方法

三、作用域和預解析

1、作用域

  • 全域性作用域:整個script標籤或者是一個單獨的js檔案。
  • 區域性作用域:在函式內部就是區域性作用域 ,這個程式碼的名字只在函式內部起效果和作用。
  • 全域性變數:全域性變數在程式碼的任何位置都可以使用,var宣告的變數是全域性變數。
  • 區域性變數:在函式裡的變數。

全域性變數和區域性變數的區別就是全域性變數只有在程式結束時才會被銷戶,比較佔記憶體,區域性變數在程式碼塊結束後,就會被銷燬,因此更節省空間。

  • 作用域鏈:內部函式用作用域鏈查詢外部函式資料能夠被內部函式訪問。遵循就近原則。

2、預解析

js引擎會把js裡所有的var和function提升到當前作用域的最前面,不會提升賦值操作。

四、物件

物件是指具體的事物,是特指。物件是一組無序的相關屬性和方法的集合。建立物件的方法有三種:

1、利用字面量建立物件

物件字面量就是花括號{}裡面包含了表達具體事物的屬性和方法。例如:

var obj = {
	uname: '姓名',
	age: 18,
	sex: '男',
	sayHi: function() {
		console.log('hi');
	}
}

呼叫物件的屬性用 obj.屬性 或者 obj[‘屬性’],呼叫物件的方法用obj.方法名()。

2、利用new Object建立物件

var obj = new Object();
obj.uname = '姓名';
obj.age: 18;
obj.sex: '男';
obj.sayHi: function() {
	console.log('hi');
	}

3、利用建構函式建立物件

建構函式是一種特殊的函式,主要用來初始化物件,即為物件成員賦初始值。他總與new運算子一起使用,建構函式類似於C語言中的結構體。例如:

function Star(uname,age,sex) {
	this.name = uname;
	this.age = age;
	this.sex = sex;
	this.sing = function(sang) {
		console.log(sang);
	}
}
var ldh = new Star('劉德華',18,'男');
ldh.sing('冰雨');

3、new關鍵字的執行過程

  1. new 建構函式可以在記憶體中建立一個空物件
  2. this 就會指向剛才建立的空物件
  3. 執行建構函式裡面的程式碼 給這個空物件新增屬性和方法
  4. 返回這個物件

4、遍歷物件

利用for in 遍歷物件,方法如下:

 for (var k in obj) {
 	console.log(k);//k變數輸出的是屬性名
 	console.log(obj[k]);//obj[k]得到的是屬性值
 }

相關文章