了解對象
對象 { key: value }
對象使用兩個大括號包裹洪鸭， 左邊是屬性名，右邊是屬性值仑扑，用逗號隔開
屬性名和屬性值 又稱為 “鍵值對”览爵，以下為對象的增刪改查
// 創(chuàng)建對象
// 1. 直接聲明
var stu = {
// 左邊就是起個名字，右邊的是它的實際值
// 后面的值可以使用任何數(shù)據(jù)類型
name: "小張",
age: 17,
address: function(){}
}
// 2. 使用構(gòu)造函數(shù)創(chuàng)建實例夫壁，先了解
var o = new Object();
console.log(stu);
console.log(o);
// 獲取屬性值
// 用. 或者 [] 的方式獲取屬性值
console.log( stu.name );
console.log( stu["age"] );
console.log( stu.address );
// 添加/修改屬性值, 重新賦值即可
// 特點： 屬性名不能重復(fù), 屬性名不能為純數(shù)字 // stu.10
stu.name = "小明";
stu["name"] = "小李";
// 如果我使用的屬性值以前沒有拾枣，那么就會添加
stu.sex = "boy";
console.log(stu);
// 刪除屬性
delete stu.age;
// 先獲取名字的值，然后做字符串拼接，再把得到的值賦值給之前的名字
stu.name = stu.name + "同學(xué)";
console.log(stu);
了解數(shù)組
用中括號包裹梅肤，可以包含很多項司蔬，每一項之間用逗號隔開。
數(shù)組的每一項都有自己的索引姨蝴，從0開始俊啼，到 length-1結(jié)束，length為數(shù)組的長度左医。
var arr = [ 1, "abc", false, {name: "張三"} ];
console.log(arr);
// 數(shù)組的每一項授帕，都可以寫任意數(shù)據(jù)類型
// 獲取數(shù)組某一項的值要用索引 arr索引是 0 1 2 3
console.log( arr[0] ); // 取索引為0的那一項，就是第一項
console.log( arr[1] );
console.log( arr[2] );
console.log( arr[3] );
// 數(shù)組長度： 數(shù)組的長度是一個數(shù)字值
console.log( arr.length );
if else 【選擇結(jié)構(gòu)】
js 代碼的三種基本結(jié)構(gòu)： 順序結(jié)構(gòu)浮梢、選擇結(jié)構(gòu)跛十、循環(huán)結(jié)構(gòu)
if、 else if 秕硝、else
// 重復(fù)聲明芥映、后面的會覆蓋前面的
var a = 1;
// var a = -1;
console.log( a );
// 比較符號: == ===
// 大于號 > 、 小于號 < 远豺、 大于等于 >= 奈偏、 小于等于 <=
// 如果和 邏輯符號一起運算，比較符號優(yōu)先
// 小括號里面的是判斷條件躯护，大括號里面的是執(zhí)行語句
if(a < 0){
// 條件成立時執(zhí)行的代碼
console.log("a是負數(shù)");
}else{
// 條件不成立時執(zhí)行的代碼
console.log("a是正數(shù)或0");
}
// if是“如果”惊来， else是“否則”
// js 代碼的三種基本結(jié)構(gòu)： 順序結(jié)構(gòu)、選擇結(jié)構(gòu)棺滞、循環(huán)結(jié)構(gòu)
// if裁蚁、 else if 、else
var a = -1;
if(a > 0){ // 判斷一
console.log("a是正數(shù)"); // 判斷一成立執(zhí)行語句
}else if(a === 0){ // 判斷二
console.log("a是0"); // 判斷二成立執(zhí)行語句
}else{
console.log("a是負數(shù)"); // 以上都不成立執(zhí)行語句
}
if-else 【小練習(xí)】
var arr = ["a", "b", "c"];
arr = []; // 直接給arr賦值
console.log(arr.length);
if( arr.length > 0 ){
console.log(arr);
}else{
console.log("這個數(shù)組為空");
}
var stu = {
name: "小張",
age: 18
}
if( stu.age >= 18 ){
console.log("已成年");
}else{
console.log("未成年");
}
if(a>0 && b>0){ // false
console.log("a检眯、b都是正數(shù)");
}else if(a>0 || b>0){ // true
console.log("a厘擂、b有一個是正數(shù)");
}else{
console.log("a、b都不是正數(shù)");
}
var c;
// 如果小括號里面有一個值锰瘸，那么就直接判斷它的布爾值，為true時則執(zhí)行
if(c){
console.log(a);
}
三元運算符【選擇結(jié)構(gòu)】
三元運算符昂灵，也稱三目運算符避凝， 跟if else 語句等價
// if else 不跟
var a = -10;
// if(a>0){
// console.log("正數(shù)");
// }else{
// console.log("負數(shù)或0");
// }
// 條件判斷 ? 執(zhí)行一 : 執(zhí)行二;
a > 0 ? console.log("正數(shù)") : console.log("負數(shù)或0");
var b = "";
// 先判斷 字符串b的長度, 大于0 就打印b, 否則 就給b 賦值 "a"
b.length > 0 ? console.log(b) : b = "a";
var m = -10;
var n = 20;
// 判斷 m>0 && n>0
// 判斷結(jié)果是true， 所以執(zhí)行 m+n 眨补。 var sum = m + n
// 如果判斷結(jié)果是false管削， 那么 var sum = null;
var sum = m>0 && n>0 ? m+n : null;
console.log(sum);
var c = 0;
// 如果小括號里面有一個值，那么就直接判斷它的布爾值撑螺，為true時則執(zhí)行
if(c){
console.log(c);
}
// 判斷c的布爾值含思， 如果成立執(zhí)行前面的語句， 后面是null，代表沒有執(zhí)行
c ? console.log(c) : null;
switch-case 【選擇結(jié)構(gòu)】
var a = "6";
// 把a和"case" 后面的每一個值做比較含潘，當(dāng)比較的值一致饲做，那么執(zhí)行下面的代碼
switch (a) {
case "1":
alert("今天周一");
break;
case "2":
alert("今天周二");
break;
case "3":
alert("今天周三");
break;
case "4":
alert("今天周四");
break;
case "5":
alert("今天周五");
break;
default: // 以上都不成立，則執(zhí)行default
alert("今天周末");
}
// break 一定要加遏弱，遇到break就跳出盆均，后面的代碼不再執(zhí)行。
// 只要匹配一次漱逸，后面就不比較了
// switch 中的比較是 用 === 來比較的
for循環(huán)【循環(huán)結(jié)構(gòu)】
每一輪的for循環(huán)都有四步:
1.設(shè)置初始值 var i=0
2.是否滿足循環(huán)執(zhí)行條件泪姨， i<5
3.滿足條件，執(zhí)行{循環(huán)體}中的代碼
4.執(zhí)行完后饰抒，再做累加 i++ // i=i+1
做完第四步肮砾，重復(fù)二三四步
注：循環(huán)會做重復(fù)的操作，操作的次數(shù)有限制袋坑。如果操作次數(shù)沒有限制仗处，那么稱“死循環(huán)”
// i執(zhí)行5次， 輸出 0 1 2 3 4
for(var i=0; i<5; i++){
console.log(i);
}
// 下面是死循環(huán)咒彤， n永遠都大于-1,所以程序就卡死了
// for(var n=0; n>-1; n++){
// console.log(n);
// }
i++和++i的區(qū)別
都類似于i = i + 1
i++;
先使用i疆柔， 再累加++i;
先累加， 再使用i
var i = 0;
// i=i+1; // 把i值加一后镶柱，重新賦值給i
// 兩步： 第一步 累加旷档， 第二步賦值
// 1. 先使用i, 打印0
// 2. 執(zhí)行累加， i = i+1
// 3. 第二次打印 i為 1
console.log(i++); // 0
console.log(i); // 1
console.log(i++); // 1
console.log(i); // 2
i++和++i 拆解
var i = 0;
// console(i++); // 0
// console.log(i); // 1
// 上面的兩步 可以做一個拆解
console.log(i);
i=i+1;
console.log(i);
// 除了 i++歇拆， 還有 ++i
// 先累加鞋屈， 再使用
i = 0; // 先設(shè)置i為0
// console.log(++i); // 1
// console.log(i); // 1
// 第一句話，拆解成兩步
i=i+1;
console.log(i);
console.log(i);
for循環(huán)復(fù)習(xí)
核心四步驟： 1.聲明 2.判斷 3.執(zhí)行 4.累加
for(var i=0; i<100; i++){
// % 是取余操作, 目前找偶數(shù)
// 如果if判斷的語句只有一行故觅，可以簡寫省略大括號厂庇，放在if判斷后面
// i + "、" 是字符串拼接
// 奇數(shù)
if(i%2 === 1) document.write(i+"输吏、");
// 偶數(shù)
// if(i%2===0) document.write(i + "权旷、");
}
// 偶數(shù)多打印一次
for(var n=0; n<5; n++){
if(n%2===0){
console.log(n);
}
console.log(n);
}
while循環(huán)
我一直執(zhí)行一段代碼， 直到判斷條件不滿足贯溅，則停止
// 定義變量
var i = 0;
// 1. 判斷條件 i<5
// 2. 執(zhí)行大括號內(nèi)的語句 (里面一般有自增運算)
// 重復(fù)2拄氯、3步驟
while(i<5){
console.log(i);
i++;
// i++ 是自增運算， 如果不加它浅，i一直為0译柏，會出現(xiàn)死循環(huán)
}
for循環(huán)和while循環(huán)的轉(zhuǎn)換【練習(xí)】
for(var n=0; n<5; n++){
if(n%2===0){
document.write(n);
}
document.write(n);
}
// 偶數(shù)多打印一次
document.write("----------");
// 用while循環(huán)，對for循環(huán)做改造（寫法不同姐霍，功能一樣）
var i=0;
while(i<5){
if(i%2 === 0){
document.write(i);
}
document.write(i);
i++;
}
continue-break【補充】
continue： 跳出本次循環(huán)
break: 跳出當(dāng)前的整個循環(huán)
for(var i=0; i<5; i++){ // 0~4
if(i === 1){
// continue; // 跳出這一次循環(huán)鄙麦，然后繼續(xù)執(zhí)行后面的循環(huán)
break; // 跳出整個循環(huán)
}
console.log(i);
}
console.log("-----------------------");
// 跳出i為偶數(shù)的循環(huán)
for(var i=0; i<20; i++){
if(i % 2 === 0){
continue;
}
console.log(i);
}
console.log("-----------------------");
// 跳出i在 10到19之間的循環(huán)
for(var i=0; i<30; i++){
if(i>=10 && i<=19){
continue;
}
console.log(i);
}
for-in【循環(huán)對象】
var stu = {
name: "小明",
age: 18,
hobby: "游泳"
}
// 對象的【遍歷】典唇， 使用for in， 把對象中的每一個鍵值對 過一遍
// key: value
// var 變量名 in 對象
// 在{}中寫執(zhí)行的代碼 屬性值使用 對象[變量名]胯府，不要用點
for(var key in stu){
console.log(stu[key]);
// console.log( stu.key ); // 打印的都是 undefined
}
for(var n in stu){
console.log(stu[n]);
}
函數(shù)
函數(shù)： 是一個功能介衔，一個方法
1）聲明/定義 上面兩種寫法，會把寫的代碼當(dāng)成字符串存儲起來
function 函數(shù)名(){ ...一大堆代碼 }
2）執(zhí)行
函數(shù)名();
// 用變量的方式聲明函數(shù)
var fn1 = function (){
console.log(1);
}
// 普通函數(shù)聲明盟劫，小括號前是函數(shù)名
function fn2(){
console.log(2); //...
}
// 2）執(zhí)行
fn1();
fn2();
console.log(typeof fn1); // function
console.log(Object.prototype.toString.call(fn2)); // [object Function]
引用數(shù)據(jù)類型【小練習(xí)】
引用數(shù)據(jù)類型夜牡，也稱復(fù)雜數(shù)據(jù)類型
操作的是地址空間
var arr = ["a", "b", "c", "d"]; // 數(shù)組
var obj = { name: "硬件一班" }; // 對象
var fn = function(){} // 函數(shù)
var arr1 = arr; // 數(shù)組復(fù)制了一份，但是復(fù)制的是地址空間 比如內(nèi)存地址：xxff11
arr[0] = "aaa"; // 修改了第一項
arr1[1] = "bbb";
console.log(arr1); // ["aaa", "bbb", "c", "d"]
console.log(arr); // ["aaa", "bbb", "c", "d"]
// 引用數(shù)據(jù)類型 存儲的是地址空間
// 就像地圖一樣侣签，只要實際的地點變了塘装，所有的地圖都跟著變
var stu = {
name: "小明",
age: 17,
hobby: "游戲"
}
var stu2 = stu1 = stu;
// 一個變了，所有的跟著變影所，因為3個指向的是同一個地址空間
stu.age = 18;
console.log(stu);
console.log(stu1);
console.log(stu2);
獲取dom節(jié)點
html部分
<div id="box">
<ul class="myUl">
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
</div>
js部分
// 1.通過id獲取dom節(jié)點蹦肴，得到一個元素
var box = document.getElementById("box");
console.log(box);
// 2.通過標簽名獲取, 得到類數(shù)組
var lis = document.getElementsByTagName("li");
console.log(lis);
// 3.通過類名獲取元素, 得到類數(shù)組
var myUl = document.getElementsByClassName("myUl");
console.log(myUl);
// 4.h5提供的querySelector來獲取 id、類名猴娩、標簽名都可以阴幌。只獲取一個
// querySelectorAll獲取所有
// var dom = document.querySelector("#box");
// var dom = document.querySelector(".myUl");
var dom = document.querySelector("li");
// var dom = document.querySelectorAll("li");
console.log(dom);
