Web前端學習總結第四周
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關鍵字的執行過程
- new 建構函式可以在記憶體中建立一個空物件
- this 就會指向剛才建立的空物件
- 執行建構函式裡面的程式碼 給這個空物件新增屬性和方法
- 返回這個物件
4、遍歷物件
利用for in 遍歷物件,方法如下:
for (var k in obj) {
console.log(k);//k變數輸出的是屬性名
console.log(obj[k]);//obj[k]得到的是屬性值
}
相關文章
- 第四周學習總結
- 第四周總結(2024.7.27)
- 暑期第四周總結
- 暑假第四周總結
- Web前端入門的學習路線總結Web前端
- 第九周學習總結
- Web前端學習筆記之前端跨域知識總結Web前端筆記跨域
- 2024暑假第四周總結
- 《計算機基礎與程式設計》第四周學習總結計算機程式設計
- 學習Java第四周Java
- odoo Web Controllers 學習總結OdooWebController
- Web前端學習路線資料彙總,Web前端培訓學校Web前端
- 2020—2021—1學期20202405《網路空間安全導論》第四周學習總結
- 學習Java的第四周Java
- 學不好Web前端的幾個原因總結!Web前端
- 20241313 劉鳴宇 《計算機基礎與科學概論》第四周學習總結計算機
- Web前端如何學?Web前端學習方法分享Web前端
- 2024-2025 20241413 《計算機基礎與程式設計》第四周學習總結計算機程式設計
- web前端工程師總結出一套正確的學習思路Web前端工程師
- 2024-2025-1 學號20241315《計算機基礎與程式設計》第四周學習總結計算機程式設計
- 2024-2025-1 20241407《計算機基礎與程式設計》第四周學習總結計算機程式設計
- 2024-2025-1 20241316 《計算機基礎與程式設計》第四周學習總結計算機程式設計
- 2024-2025-1 20241328 《計算機基礎與程式設計》第四周學習總結計算機程式設計
- 2024-2025-1 20241403《計算機基礎與程式設計》第四周學習總結計算機程式設計
- 2024-2025-1(20241321)《計算機基礎與程式設計》第四周學習總結計算機程式設計
- 2024-2025-1 20241301 《計算機基礎與程式設計》第四周學習總結計算機程式設計
- (2024-2025-1)20241420《計算機基礎與程式設計》第四周學習總結計算機程式設計
- 前端基礎 — Web事件總結前端Web事件
- 學期2024-2025-1 學號20241317 《計算機基礎與程式設計》第四周學習總結計算機程式設計
- web前端學習方案Web前端
- web前端學習之路Web前端
- web前端學習指南Web前端
- PHP 第四周函式學習記錄PHP函式
- 周總結
- web前端開發規範總結Web前端
- 【博學谷學習記錄】超強總結,用心分享|前端CSS總結(一)前端CSS
- web前端學習路線,前端開發最全知識點彙總(附學習教程資料)Web前端
- 2017騰訊Web前端實習生招聘筆試題總結Web前端筆試