1.數組的訪問與遍歷

數組對象的作用是：

使用單獨的變量名來存儲一系列的值。

數組的訪問

使用數組索引可以直接訪問
例如：arr[i]
其中i可以是數字表示數組的順序，也可以是一個數組中值得鍵名表示

數組的遍歷

for循環來遍歷
for in ：遍歷對象
ES5: forEach()
ES6中的箭頭函數

類數組：

借助的對象字面量的語法來創建的類數組，和數組大致相同。
1.成員的鍵名必須是0遞增的正整數
2.對象必須要有一length屬性
下面是實驗的過程

控制台的效果圖

代碼部分

<!DOCTYPE html>
<html>
<head>
<title>數組遍歷</title>
<meta charset="utf-8">
</head>
<body>
<!-- 1 將課程中的所有案例全部在按制台運行一遍
2 對於數組的聲明,訪問,遍歷常用的方法全部全部熟練掌握
3 對於函數的聲明,調用,參數,以及常用屬性,arguments對象必須掌握
4 將數組的遍歷與函數的調用與參數處理提交到博客中 -->
<script type="text/javascript">
var apho = ['apple','apple1','apple2','apple3'];
apho.name = 'daapp';
apho['user name'] = 'app';
//for循環遍歷
for (var i = 1; i <= 1; i++) {
console.log(apho[i]);
}
//for in: 遍歷對象
for (var i in apho) {
console.log(apho[i]);
}
// foreach遍歷數組
apho.forEach(function(item, key, apho){
// console.log(item);
console.log(apho[key]);
});
//foreach箭頭函數，遍歷數組
apho.forEach(item=>console.log(item));
//類數組
var objArr = {
0: 'hello',
1: 'wrold',
2: {1:33.5, 2:44.5},
3: 'defind',
length: 4
};
// objArr.forEach(function (item){
// console.log(item);
// })
for (var i = 0; i < 3; i++) {
var p = document.createElement('p');
p.innerHTML='hello wrold';
document.body.appendChild(p);
console.log(p);
}
var eles = document.getElementsByTagName('p');
console.log(eles);
for (var i = 0; i < eles.length; i++) {
console.log(eles[i].innerHTML);
}
</script>
</body>
</html>

2.函數的聲明,調用

函數的聲明

function show1(value) { console.log(value); }

函數的調用

show1('what you name ');
構造函數:構建JS語句大廈的基礎
構造函數是用來創建對象的
構造函數可以由任何函數構成,但並不是都會創建出對象,除非用new
function show() {...}

函數的重復申明

js中的函數允許重復聲明,以最后一個為准
es5中變量允許重復聲明

return返回

一旦遇到return 返回給調用者后面的語句全部忽略

函數也是對象, 對象就會有屬性/方法

函數有name, length的屬性
console.log(add.name);
console.log(add.length);

函數的方法:

toString(), 返回函數源代碼console.log(add.toString());

函數作用域

全局: global: 頂層函數之外聲明的,可以在函數內訪問
局部: local: 函數內部聲明,僅限內部訪問,外部不可見
函數內部聲明的變量如果不加var,就不能和當前的作用域綁定, 自動與全局綁定

下面是控制台的效果圖

主要代碼

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>函數</title>
</head>
<body>
<script>
//函數的聲明
function show1(value) {
console.log(value);
}
//函數的調用
show1('what you name ');
// 函數表達式 / 匿名函數聲明與調用,函數表達式后面沒有‘；’
var show2 = function display(value) {
console.log(value);
}
show2('wo jiao da wei ');
console.log(show2.name);
//由於是函數表達式，所以函數未定義，無法傳值，顯示錯誤
// display(" How old are You");
//構造函數
var sum = Function('a','b', 'return a + b');
console.log(sum(11, 111));
//與上面的函數意義相同
// var sum = function (a, b) {return a + b;}
// console.log(sum(20, 90));
// 函數做為值的使用場景
function add (a, b, c) {
// 輸出結果
return a + b +c;
}
// 賦值，由於還有一個c沒傳值，結果為NAN
var sum = add;
console.log(sum(12, 23));
// 函數當做對象屬性
var obj = {};
obj.sum = add;
console.log(obj.sum(50, 90,13));
// 函數當參數: 回調
function huidiao(callback, a, b,c) {
return callback(a, b,c);
}
console.log(huidiao(add, 28, 49,123));
// 函數當返回值
function fun1() {
return add;
}
console.log(fun1()(39, 27,12) );
// es5: 不支持塊作用域
if (true) {
var name = '測試1';
}
console.log(name);
// es6: 支持塊作用域，顯示未定義
// if (true) {
// let names = '測試2';
// }
// console.log(names);
// 函數的參數對象/參數類數組
function sum(...params) {
console.log(arguments);
for (var i = 0; i < arguments.length; i++) {
console.log(arguments[i]);
}
console.log(a + b);
}
sum(10,20,40,50);
console.log(sum.length);
// 閉包用來訪問私有變量
function demo1() {
var email = '144682@qq.com';
// 子函數
return function hello(){
console.log(email);
}
hello;
}
// console.log(email);
// console.log(typeof demo1()());
console.log(demo1());
console.log(demo1()());
</script>
</body>
</html>

數組與函數的調用