摘要:一彈窗和輸出執行順序是從上到下執行控制瀏覽器彈出一個警告框讓計算機在頁面中輸出一個內容在中寫一個內容寫可以向中輸出一個內容看我出不出來向控制臺輸出一個內容作用是向控制臺輸出一個內容你猜我在哪出來二編寫位置可以將代碼編寫到外部文件中,然后通過
一.彈窗和輸出
**javascript執行順序是從上到下執行**
1.控制瀏覽器彈出一個警告框
alert("HelloWord");
2.讓計算機在頁面中輸出一個內容在 document中寫一個內容 (write寫)
document.write(); 可以向body中輸出一個內容 document.write("看我出不出來···");
3.向控制臺輸出一個內容
console.log(); 作用是向控制臺輸出一個內容 console.log("你猜我在哪出來");
二 .js編寫位置
1.可以將js代碼編寫到外部js文件中,然后通過script標簽引入
寫到外部文件中可以在不同的頁面中同時引用,也可以利用到瀏覽器的緩存機制
推薦使用方法
2.script標簽一旦用于引入外部文 件了,內部就不能再編寫代碼了,即使編寫了
瀏覽器也會忽略
如果需要可以在創建一個新的script標簽用于編寫內部代碼
3.可以將js代碼編寫到標簽的onclick屬性中
當我們點擊按鈕時,js代碼才會執行
雖然可以寫在標簽的屬性中,但是他們屬于結構與行為耦合,不方便維護
可以將js代碼寫在超鏈接的href屬性中,這樣當點擊超鏈接時,會執行js代碼
你也點我一下 你也點我一下
三.基本語法
1.js注釋(/**/)
多行注釋,注釋中的內容不會被執行,但是可以在源代碼中查看
要養成良好的編寫注釋的習慣,也可以通過注釋來對代碼進行一些簡單的調試
2.單行注釋(//)
3.JS中嚴格區分大小寫
4.JS中每一條語句以分號(;)結尾
-如果不寫分號,瀏覽器會自動添加,但是會消耗一些系統資源
而且有點時候瀏覽器會加錯分號
5.JS中會忽略多個空格和換行,所以我們可以利用空格和換行對代碼進行格式化
四.字面量和變量
1.字面量都是一些不可改變的值
比如:1 2 3 4 5 字面量都是可以的直接使用,但是我們一般都不會直接使用字面量
變量 變量可以用來保存字面量,而且我們一般都不會直接使用字面量
變量更加方便我們使用,所以在開發中都是通過變量去保存一個字面量 而很少直接使用字面量 可以通過變量對字面量進行描述 變量 字面量 x = 1
2.把聲明變量和對該變量賦值一次完成:
var mood(心情) = "happy",age = "22";
3.變量名允許包含字母、數字、美元符號和下劃線(但第一個字符不允許是數字)。為了讓比較長的變量名更容易閱讀,可以在變量名中的適當位置插入下劃線,就像這面這樣:
var my_mood = "happy";
五、標識符
-在js中所有的可以由我們自主命名的都可以稱為標識符
-例如:變量名,函數名,屬性名都屬于標識符
-命名一個標識符時需要遵守如下的規則:
1.標識符中可以含有字母、數字、_、$ 2.標識符不能以數字開頭 3.標識符不能是ES中的關鍵字或保留字 4.標識符一般都采用駝峰命名法 通常駝峰法格式是函數名、方法名和對象屬性名命名的首選格式 -首字母小寫,每個單詞的開頭字母大寫,其余字母小寫 helloworld 駝峰命名法:helloWorld var myMood = "happy"; --注意:js底層保存標識符是實際上是采用的Unicode編碼, 所以理論上講,所有的utf-8中含有的內容都可以作為標識符 a標識符 自己起的名字 var a = 1; 可以含有字母、數字、_、$ var a_1_$ = 123; console.log(a_1_$); //輸出為123 標識符不能是ES中的關鍵字或保留字 ES var var = 123; console.log(var); //會報錯
注意:
var 鋤禾日當午 = 789; //千萬不要這么用 console.log(鋤禾日當午);
六、字符串
1.數據類型指的就是字面量的類型
在js中一共有六中數據類型 String 字符串 "123" Number 數值 123 Boolean 布爾值 true或是false Null 空值 Undefined 未定義 Object 對象
其中String Number Boolean Null Undefined 屬于基本數據類型
而Object 屬于引用數據類型
2.String字符串
1.-字符串由零個或多個字符構成,字符包括(但不限制)字母、數字、標點符號和空號 -在js中字串符需要使用引號引起來 -使用雙引號或單引號都可以,但是不要混著用 -引號不能嵌套,雙引號不能放雙引號,單引號不能放單引號, 單引號里面可以放雙引號,雙引號里面可以放單引號 2.在字符串中我們可以使用作為轉義字符, 當表示一些特殊符號時可以使用進行轉義 "" 表示 "" "" 表示 "" 表示換行 表示制表符(空格) 表示 str ="我說:"今天 天氣真不錯""; str="" //輸出字面量 字符串str alert("str"); //輸出變量str alert(str);
3.如果想在上面這條語句中使用單引號,就必須保證字母“n”和“t”之間的單引號能別當成這個字符串的一部分,這種情況下這個單引號需要被看做一個普通字符,而不是這個字符串的結束標志,這種情況我們需要對這個字符進行轉義,在js里用反斜線對字符串進行轉義:
var mood = "don"t ask";
4.類似地,如果想用雙引號來包住一個本身就包含雙引號的字符串,就必須用反斜線對字符串中的雙引號進行轉義:
var height = "about 5"10" tall"; alert(height);
會彈出下面:
七、Number
1.在js中所有的數值都是Number類型
如果想給一個變量賦一個數值,不用限定它必須是一個整數,js允許使用帶點小數點的數值,并且允許任意位小數,這樣的數稱為浮點數
var age = 33.25;
也可以使用負值,在有關數值的前面加上一個減號(-)表示它是一個負數:
var temperture = -20;
js也支持負數浮點數
var temperture = -20.690;
包括整數和浮點數(小數)
//數字123 var a = 123; //字符串123 var a = "123"; console.log(typeof a); /* * 可以使用一個運算符typeof * 來檢查一個變量的類型 * 語法:typeof 變量 * 檢查數值時,會返回number * 檢查字符串時,會返回string */
2.js中可以表示的數字的最大值 (最大值:1.7976931348623157e+308)
Number.MAX_VALUE 1.7976931348623157e+308 Number.MIN_VALUE 大于0的最小值 5e-324 (0.后面的三百位數) console.log(Number.MAX_VALUE); //會輸1.7976931348623157e+308 a = Number.MAX_VALUE*Number.MAX_VALUE; a = "abc" * "bcd" //會輸出NaN a = NaN; //不加引號 輸出number 加了會輸出string a = Number.MIN_VALUE; //會輸出Infinity console.log(a);
3.如果使用Number表示的數字超過了最大值,則會返回一個Infinity
Infinity 表示正無窮 -Infinity 表示正無窮 使用typeof檢查Infinity也會返回Number
NaN 是一個特殊的數字,表示Not A Number
使用typeof檢查NaN也會返回Number // 在js中整數的運算基本可以保證精確 var c = 1+1; //如果使用js進行浮點運算,可能得到一個不精確的結果 //所以千萬不要使用js進行對精確度要求比較高的運算 var c = 0.1 + 0.2; console.log(c);
八、布爾值
Boolaen 布爾值
布爾值只有倆個,主要用來做邏輯判斷
true -表示真
false -表示假
使用typeof檢查一個布爾值時,會返回boolean
var bool = true; console.log(typeof true);
九、Null和Undefined
1.Null類型的值只有一個,就是 Null
null這個值專門用來表示一個為空的對象 使用typeof檢查一個null時,會返回object
2.Undefined(未定義)類型的值只有一個,就undefined
當聲明一個變量,但是并不給變量賦值時,它的值就是undefined 使用typeof檢查一個undefined時也會返回undefined var a = null; console.log(typeof a); //會輸出object var b; console.log(b); //會輸出undefined
十、強制類型轉換-string
1.強制類型轉換
- 指將一個數據類型強制轉換為其他的數據類型 - 類型轉換主要指,將其他的數據類型,轉換為 String Number Boolean
將其他類型轉換為String
方式一:
- 調用被轉換數據類型的toString()方法 - 該方法不會影響到原變量,它會將轉換的結果返回
-但是要注意:null和 undefined這倆個值沒有toString()方法 如果調用他們的方法會報錯 var a = 123; //調用a的toString()方法 //調用xxx的yyy()方法,就是xxx.yyy() var a = a.toString(); console.log(a); var a = true; //先寫一個類型 // var a = a.toString(); //在寫a.toString() 可以轉 console.log(a); a = null; //空值 // a = a.toString(); //不能轉 會報錯 console.log(a); a = undefined; // a = a.tostring(); //不能轉 會報錯 console.log(a);
方式二:
-調用 String()函數,并將轉換的數據作為參數傳遞給函數 -使用String()函數做強制類型轉換時 對于 Number 和 Boolean實際上調用的就是toString()方法 但是對于null 和 undefined就不會調用toString()方法 它會將(字面量)null直接轉換為(字符串)"null" 它會將(字面量)undefined直接轉換為(字符串)"undefined" a = 123; //調用tostring()函數,來將a轉換為字符串 (轉誰就把誰寫在括號里面) a = String(a); //S一定要大寫 a = null; a = String(a); //不會報錯 a = undefined; a = String(a); //不會報錯 console.log(typeof a); console.log(a);
十一、強制類型轉換-Number
1.將其他的數據轉換為Number
轉換方法一: 使用Number()函數 -字符串-->(轉換)數字 1.如果是純數字的字符串,則直接將其轉換為數字 2.如果字符串中有非數字的內容,則轉換為NaN 3.如果字符串是一個空串或者是一個全是空格的字符串,則轉換為0 -布爾(boolean)-->(轉換)數字 true 轉換為1 false 轉換為0 -Null-->數字==0 -undefined-->數字==NaN //轉換方式一: var a = "123"; //調用Number()函數來將a轉換為Number類型 a = Number(a); //括號里面要寫數值 a = true; //true的類型是boolean a = Number(a); // 輸出為1 a = false; //false的類型是boolean a = Number(a); // 輸出為0 a = null; a = Number(a); // 輸出為0 a = undefined; a = Number(a); // 輸出為NaN
轉換方式二:
-這種方式專門用來對付字符串 -parseInt()把一個字符串轉換為一個整數 -parseFloat() 把一個字符串轉換為一個浮點 //轉換方式二: a = "123px"; //調用parseInt()函數將a轉換為Number /* parseInt()可以將一個字符串中的有效的整數內容取出來,(px不是數字所以不讀,就只剩下數字) 然后轉換為Number (如果第一個是英文字母 轉換的就是NaN(包括點.也在內 .以后的東西也不讀)) */ a = parseInt(a); /* parseFloat()作用和parseInt()類似,不同的是它可以獲得有效的小數 */ a = "123.456px"; a = parseFloat(a); //輸出123.456 /* 如果對非String使用parseInt()或parseFloat() 它會現將其轉換為String然后再操作 */ a = true; // a = parseInt(a); // 輸出為NaN a = parseFloat(a); console.log(typeof a); console.log(a);
十二、其他進制的數字
1.在js當中,如果需要表示16進制的數字,則需要以0x開頭
如果需要表示8進制的數字,則需要以0開頭 如果需要表示2進制的數字,則需要以0b開頭,但是不是所有的瀏覽器都支持 //16進制數字 a = 0xDD; //8進制數字 a = 056; //2進制數字 a = 0b10; console.log(a); var height = "about 5"10" tall"; alert(height);
十三、轉換為boolean
將其數據類型轉換為boolean
一種方法:使用boolean()函數 -數字--->布爾 除了0和NaN,其余的都是true -字符串--->布爾 除了空串,其余的都是true -null和undefined都會轉換為false -對象也會轉換為true var a =123; //輸出為true a = -123; //輸出為true a = 0; //輸出為fals a = Infinity; //輸出為true Infinity無窮 a = NaN; //輸出為true //調用Boolean()函數來將a轉換為布爾值 a = Boolean(a); a = "hello"; //本身輸出為string a = boolean(a); //加上boolean()以后輸出為true a = "flase"; a = boolean(a); //輸出為true a = "null"; a = boolean(a); //輸出為flase console.log(typeof a); console.log(a);
十四、算數運算符
1.運算符也叫操作符
通過運算符可以對一個或多個值進行運算,并獲取運算結果 比如:tupeof就是運算符,可以來獲得一個值得類型 它會將該值的類型以字符串的形式返回 number string boolean underfined objuct
2.算數運算符
當對非Number類型的值進行運算時,會將這些值轉換為Number然后在運算 任何值和NaN做運算都得NaN + +可以對兩個值進行加法運算,并將結果返回 如果對倆個字符串進行加法運算,則會做拼串 會將倆個字符串拼接為一個字符串,并返回 任何的值和字符串做加法運算,都會先轉換為字符串,然后在和字符串做拼串的操作轉成字符串 — 可以對兩個值進行減法運算,并將結果返回 轉成number * 可以進行乘法運算 / 可以進行除法運算 % %取模運算(取余數)
//加法例子:
var a = 123;
var result = typeof a; console.log(typeof result); //輸出為string a + 1; //輸出為123 result = a + 1; //輸出為124 result = 35 + 35; //輸出為70 result = true + 35; //輸出為36 result = true + false; //輸出為1 true為1 false為0 result = 2 + null; //輸出為2 null為 result = 2 + NaN; //輸出為NaN result = "123" + "456"; //輸出為123456 倆個字符串相加 數字連在一起 result = "鋤禾日當午" //如果想把詩寫的工整就這樣寫 也可以這樣寫"鋤禾日當午,汗滴禾下土,誰知盤中餐,粒粒皆辛苦" +"汗滴禾下土"+ "誰知盤中餐"+ "粒粒皆辛苦"; result = 123 + "hello"; //輸出為123hello //任何值和字符串相加都會轉換為字符串,并做拼串操作 console.log(result); //number轉換為string /* 我們可以利用這一點,來將一個任意的數據類型轉換為string 我們只需要為任意的數據類型加一個""即可將其轉換為string 這是一種隱式的類型轉換,由瀏覽器自動完成,實際上它也是調用string()函數 */ var c = 123; c = c + "h"; console.log(typeof c); console.log(c); console.log("c = " +c); //輸出為c=123h //小練習 result = 1 + 2 + "3"; //輸出為33 1+2=3 字符串相拼 33 console.log("result="+result); //輸出為 result=33 result = "45" + 2 + 3; //輸出為4523 console.log(result); //減法例子: result = 100 - 5; //輸出為result =95 result = 100 - true; //輸出為99 true為1 result = 100 - "1"; //輸出為99 把"1"轉換為number 1 相當于100-1 console.log("result = "+result); //乘法例子 result = 2 * 2; //輸出為result=4 result = 2 * "8"; //輸出為result=16 result = 2 * undefined; //輸出為result=NaN result = 2 * null; //輸出為result=0 null=0 console.log("result = "+result); //除法例子 result = 4 / 2; //輸出為result=2 result = 3 / 2; //輸出為result=1.5 /* 任何值做- * / 運算時都會自動轉換為Number 我們可以利用這一特點做隱式的類型轉換 可以通過為一個值 —0 *1 /1 來將其轉換為Number */ console.log("result = "+result); var d = "123"; d = d - 1; //輸出為122 console.log(typeof d); console.log(d); //%例子 result = 9 % 3; //9除以3 等于3余0 相除取余數 輸出為0 result = 9 % 4; //9除以4 等于2余1 相除取余數 輸出為1 console.log("result = "+result);
十五、一元運算符
一元運算符,只需要一個操作數 + 正號 -正號不會對數字產生任何影響 — 負號 -負號可以對數字進行負號的取反 —對于非number類型的值 它會將先轉換為number,然后再運算 可以對一個其他的數據類型使用+,來將其轉換為number 它的原理和number()函數一樣 var a = 123; a = +a; //輸出為123 a = -a; //輸出為-123 console.log("a = "+a); a = true; // 輸出為boolean a = -1 a = -a; // 輸出為number a = -1 a = "123"; // 輸出為 a = 123 string a = +a; // 輸出為 a = 123 number console.log("a = "+a); console.log(typeof a); var result = 1 + +"2" + 3; //輸出為6 +"2"字符串2轉換為number2 1+2+3=6 console.log("result = "+result);
十六、自增和自減
自增++
—通過自增可以使變量在自身的基礎上增加1 —對于一個變量自增以后,原變量的值會立即自增1 —自增分為倆種:后++(a++),前++(++a) 無論是a++ 還是++a,都會立即使原變量的值自增1 不同的是a++ 和 ++a的值不同 a++的值等于原變量的值 (自增前的值) ++a的值等于新值 (自增后的值)
自增--
—通過自減可以使變量在自身的基礎上減1 —自減分為倆種:后--(a--) 和 前--(--a) 無論是a--還是--a都會使原變量的值自減1 不同的是a-- 和 --a的值不同 a--的值等于原變量的值 (自增前的值) --a的值等于新值 (自增后的值) //自增例子 var a = 1; //使a自增1 a++; //輸出為a=2 ++a; //輸出為a=2 console.log("a = "+a); var a = 1; console.log(a++); //輸出為1 var a = 1; console.log(++a); //輸出為2 var a = 1; console.log("++a = "+ ++a); //輸出為++a=2 console.log("a++ = "+ a++); //輸出為++a=1 console.log("a = "+a); //輸出為a=2 var c = 10; //第一次c++ 是在10的基礎上自增 c++; //第二次c++ 是在11的基礎上自增 c++; console.log(c++); var d = 20; console.log(++d); //輸出為21 console.log(++d); //輸出為22 //d++先用后加 ++d先加后用 //d++=20 ++d=22 d=22 var d = 20; var result = d++ + ++d + d; console.log("result ="+result); //輸出為result =64 var d = 30; var result = ++d + d++ + d; //31 32 31 console.log("result ="+result); //輸出為result =94 var d = 30; d = d++; /* 相當于 d=30 var e = d++; d = e */ console.log("d ="+d); //輸出為d =30 //自減例子 var num = 10; num--; //輸出為num=9 --num; //輸出為num=9 console.log("num ="+num); var num = 10; console.log(num--); //輸出為10 console.log(--num); //輸出為9 var d = 10; result = num-- + --num + d; console.log("result ="+result); //輸出為24
十七、自增練習
//d++先用后加 ++d先加后用
var n1 = 10 , n2 = 20; var n = n1++; //n1 = 11 n1++ = 10 console.log("n="+n); //n=10 console.log("n1="+n1); //n1=11 n = ++n1; //n1=12 ++n1=12 console.log("n="+n); //n=12 console.log("n1="+n1); //n1=12 //d--先減后用 --d返回原值 n = n2--; //n2=19 n2--=20 console.log("n="+n); //n= 20 console.log("n12="+n2); //n2=19 n = --n2; //n2=18 --n2=18 console.log("n="+n); //n=18 console.log("n12="+n2); //n2=18
十八、邏輯運算符
JS中為我們提供了三種邏輯運算法
! 非 — !可以用來對一個值進行非運算 — 所謂非運算就是值對一個布爾值進行取反操作 flas變etrue , true變flase — 如果對一個值進行倆次取反,它不會變化 — 如果對非布爾值進行元素,則會將其轉換為布爾值,然后在取反 所以我們可以利用該特點,來將一個其他的數據類型轉換為布爾值 可以為一個任意數據類型去倆次反,來將其轉換為布爾值 原理和boolean()函數一樣 $$ 與 — &&可以對符號倆側的值進行與運算并返回結果 — 運算規則: — 倆個值中只要有一個值是flase就返回flase 只有倆個值都是true時,才會返回true — js中的“與”屬于短路的與 如果第一個值為flase,則不會看第二個值 || 或 — ||可以對符號倆側的值進行或運算并返回結果 — 運算規則: — 倆個值中只有一個true,就返回true 如果倆個值都是flase,才返回flase —js中的“或”屬于短路的或 如果對一個值為true,則不會檢查第二個值
// !
var a = true; //對a進行非運算 !a; //輸出為true a = !a; //輸出為flase 取反一次是flase a = !!a; // 取反二次是flase console.log("a ="+a); var b = 10; //輸出為number b = !b; //輸出為boolean b=false b = !!b; //輸出為boolean b=true console.log("b ="+b); console.log(typeof b); // && //如果倆個值都是true則返回true var result = true && true; // 輸出為true //只要有一個false就返回false var result = true && false; //輸出為false var result = false && true; //輸出為false var result = false && false; //輸出為false console.log("result ="+result); //第一個值為true,會檢查第二個值 // true && alert("看我出不出來!!"); //第一個值為false,不會檢查第二個值 // false && alert("看我出不出來!!"); // || //如果倆個值都是false則返回false resule = false || false; //輸出為false //只要有一個true就返回true resule = true || false; //輸出為true resule = false || true; //輸出為true resule = true || true; //輸出為true console.log("resule ="+resule); //第一個值為false,則會檢查第二個值 false || alert("123"); //會有彈窗 //第一個值為true,則不會檢查第二個值 true || alert("123"); //不會有彈窗
十九、非布爾值的非與或運算
&& || 非布爾值的情況 — 對于非布爾值進行與或運算時 會向將其轉換為布爾值,然后在運算,并且返回原值 — 與運算&& — 如果第一個值為true,則必然返回第二個值 — 如果第一個值為false,則直接返回第一個值 — 或運算 || — 如果第一個值為true,則直接返回第一個值 — 如果第一個值為false,則返回第二個值 // true && true // 與運算:如果倆個值都為true,則返回后邊的值 var result = 1 && 2; //輸出為2 //與運算:如果倆個值中有false,則返回靠前的false //false && true var result = 0 && 2; //輸出為0 var result = 2 && 0; //輸出為0 //false && false var result = NaN && 0; //輸出為NaN var result = 0 && NaN; //輸出為0 // true || true //如果第一個值為true,則直接返回第一個值 result = 1 || 2; //輸出為1 result = 2 || 1; //輸出為2 result = 2 || NaN; //輸出為2 //如果第一個值為false,則直接返回第二個值 result = NaN || 1; //輸出為1 result = NaN || 0; //輸出為0 result = "" || "hello"; //輸出為hello result = -1 || "你好"; //輸出為-1 console.log("result ="+result);
二十、賦值運算符
=
可以將符號右側的值賦值給符號左側的變量
var a = 123;
+=
a += 5 等價于 a = a + 5a -= 5 等價于 a = a - 5
*=
a = 5 等價于 a = a 5
/=
a /= 5 等價于 a = a / 5
%= (余數)
a %= 5 等價于 a = a % 5
var a = 10; a = a + 5; //15 a += 5; //輸出為15 和a = a + 5;是一樣的 a -= 5; //輸出為5 10-5=5 a *= 5;//輸出為50 5*10=50 a %= 3; //輸出為1 10除以3等于3余1 console.log("10 ="+10);
二十一、關系運算符
關系運算符
通過關系運算符可以比較倆個值之間的大小關系
如果關系成立它會返回true,如果關系不成立則返回false
大于號
— 判斷符號左側的值是否大于右側 — 如果關系成立,返回 true,如果關系成立則返回 false
= 大于等于
— 判斷符號左側的值是否大于或等于右側的值
< 小于號
— 判斷符號左側的值是否小于右側 — 如果關系成立,返回 true,如果關系成立則返回 false
<= 小于等于號
— 判斷符號左側的值是否小于或等于右側的值
非數值的情況
—對于非數值進行比較時,會將其轉換為數字然后在比較 — 特殊情況: 如果符號倆側的值都是字符串時,不會將其轉換為數字進行比較 而會分別比較字符串中字符的Unicode編碼 var result = 5 > 10; //輸出為false 不成立 result = 5 > 4; //輸出為true 成立 resulr = 5 > 5; //輸出為false 不成立 resulr = 5 >= 5; //輸出為true 成立 result = 5 >= 4; //輸出為true 成立 result = 5 < 4; //輸出為false不成立 resulr = 4 <= 4; //輸出為true 成立 console.log("result ="+result); //非數值的情況 console.log(1>true); //false console.log(1>true); //true console.log(1 > "0"); //true console.log(10 > null); //true null轉換為數字0 //任何值和NaN做任何比較都是false console.log(10 <= "hello"); //false "hello"轉換為數字NaN console.log(true > false); // //如果比較的倆個字符串型的數字,可能會得到不可預期的結果 console.log("1" < "5"); //true console.log("11" < "5"); //true(比較第一位 1和5做比較) //注意:在比較倆個字符串型的數字時,一定一定一定要轉型 console.log("11" < +"5"); //false //比較倆個字符串時,比較的是字符串的字符編碼 console.log("a" < "b"); //true //比較字符編碼時是一位一位的進行比較 console.log("abc" < "a"); //true //如果倆位一樣,則比較下一位,所以借用它來對英文進行排序 console.log("bbc" < "b"); //false console.log("abd" < "bad") //true //比較中文時沒有意義 console.log("戒" > "我"); //true
二十二、Unicode編碼表
//使用十六進制計算器 /* 在字符串中使用轉義字符輸入Unicode編碼表 u四位編碼 */ console.log("u0031"); //輸出為1 console.log("u2620"); //輸出為骷髏頭☠
⚀
二十三、相等運算符
相等運算==: 相等運算符用來比較倆個值是否相等 如果相等會返回true,否則會返回false 使用==來做相等運算 —當使用==來比較倆個值時,如果值的類型不同 則會自動進行類型轉換,將其轉換為相同的類型 然后再比較 不相等運算!=: 不相等用來判斷倆個值是否不相等,如果不相等返回true,否則返回false — 使用!=來做不相等運算 — 不相等也會對變量進行自動的類型轉換,如果轉換后相等也會返回false 全等運算===: — 用來判斷倆個值是否全等,它和相等類似,不同的是它不會做自動的類型轉換 如果來個值得類型不同,直接返回false 不全等!== — 用來判斷倆個值是否不全等,和不等類似,不同的是它不會做自動類型轉換 如果來個值得類型不同,直接返回true //相等運算== console.log(1 == 1); //輸出為true var a = 10; console.log(a == 4); //輸出為false 10不等于4 console.log("1" == 1); //輸出為true 字符串1和數字1相等 console.log(true == "1"); //輸出為true console.log(true == "hello"); //輸出為false console.log(null == 0); //輸出為false console.log(nill == undefined); //輸出為true /* undefined 衍生自 null 所以這倆個值做相等判斷時,會返回true */ console.log(unsefined == null); //輸出為true /* NaN不和任何值相等 包括他本身 */ console.log(NaN == "1"); //輸出為false var b = NaN; //NaN不和任何值相等 所以下面的這個方法行不通 // console.log(b == NaN); 輸出為false /* 可以通過isNaN()函數來判斷一個值是否是NaN 如果該值是NaN則返回true,否則會返回false */ console.log(isNaN(b)); //輸出為true //不相等運算!= console.log(10 != 5); //輸出為true console.log(10 != 10); //輸出為false console.log("abcd" != "abcd"); //輸出為false console.log("1" != 1); ////輸出為false //全等運算=== console.log("123" === 123); //輸出為false console.log(nill === undefined); //輸出為false //不全等!== console.log(1 !== "1"); //輸出為true
二十四、條件運算符
條件運算符也叫三元運算符 語法: 條件表達式?語句1:語句2; — 執行的流程: 條件運算符在執行時,首先對條件表達式進行求值, 如果該值為true,則執行語句1,并返回執行結果 如果該值為false,則執行語句2,并返回執行結果 如果條件的表達式的求值結果是一個非布爾值, 會將其轉換為布爾值然后在運算
二十五、運算符的優先級
,運算符 使用,可以分割多個語句,一般可以在聲明多個變量時使用 //使用,運算符同時聲明多個變量 // var a , b ,c; //可以聲明多個變量并賦值 var a=1,b=2,c=3; alert(b); //彈窗為2 就和數學中一樣,在js運算符也有優先級 比如:先乘除 后加減 在js中有一個運算符優先級的表 在表中越靠上優先級越高,優先級越高越優先計算 如果優先級一樣,則從左往右計算 但是這個表我們不需要記憶,如果遇到優先級不清楚 可以使用()來改變 var result = 1 + 2 * 3; console.log("result ="+result); //輸出為7 如果||的優先級高,或者倆個一樣高,則應該返回3 如果與的優先級高,則應該返回1 var result = 1 || 2 && 3; console.log("result ="+result); //輸出為1
二十六、代碼塊
我們的語句是由一條一條語句構成的 語句是按照自上向下的順序一條一條執行的 在js中可以使用{}來為語句進行分組 同在一個{}中的語句我們稱為是一組語句 它們要么執行,要么都不執行 一個{}中的語句我們也稱為代碼塊 在代碼塊的后面不用在編寫;了 js中的代碼塊,只具有分組的作用,沒有其他的用途 代碼塊內部的內容,在外部是完全可見的 { alert("hello"); console.log("你好"); document.write("語句"); } console.log("a ="+a); //可以執行
二十七、if語句(一)
流程控制語句: — js中的程序是從上到下一行一行執行的 — 通過流程控制語句可以控制程序執行流程 使流程可以根據一定的條件來選擇執行 — 語句分類: 1.條件判斷語句 2.條件分支語句 3.循環語句 1.條件判斷語句: — 使用條件判斷語句可以在執行某個語句之前進行判斷 如果條件成立才會執行語句,條件不成立則語句不會執行 — if語句 — 語法一: if(條件表達式){ 語句.... } if語句在執行時,會先對條件表達式進行求值判斷 如果條件表達式的值為true,則執行if后的語句 如果條件表達式的值為false,則不會執行if后的語句 if語句只能控制緊隨其后的那個語句 如果希望if語句可以控制多條語句 可以將這些語句統一放到代碼塊中{} if語句后的代碼塊不是必須的,但是在開發中盡量寫上代碼塊,即使if后只有一條語句 if(true) alert("你猜我出來嗎"); //條件成立都執行 var a = 11; if(a > 10) { alert("a比1大~~~"); alert("誰也管不了我"); } var a = 15; if(a > 10 && a <= 20) { alert("a大于10,并且a小于等于20"); //成立 }
二十八、if語句(二)
if語句 語法二: if(條件語句){ 語句..... } elae{ 語句..... } if...else...語句... 當該語句執行時,會先對if后的條件表達式進行求值判斷 如果該值為true,則執行if后的語句 如果該值為false,則執行else后的語句 語句三: if(條件語句){ 語句.... }else if(條件語句){ 語句.... }else if(條件語句){ 語句.... }elae{ 語句..... } if...else if...else 當該語句執行時,會從上到下依次對條件表達式進行求值判斷 如果該值為true,則執行當前語句 如果該值為false,則繼續向下判斷 如果所有的條件都不滿足,則執行最后一個else后的語句 該語句中,只會
//方法一
var age = 60; if(age >= 60){ alert("你已經退休了"); } else{ alert("你還沒有退休"); }
//方法二
var age = 90;
if(age > 100 && age <= 30){ alert("活著挺沒意思"); }else if(age > 80){ alert("你也老大不小了"); }else if(age > 60){ alert("你也退休了"); }else if(age > 30){ alert("你已經中年了"); }else if(age > 17){ alert("你已經成年了"); }else{ alert("你還是個孩子"); }
二十九、if練習(一)
從鍵盤輸入小明的期末成績 當成績為100時,獎勵一倆BMW 當成績為[80-99]時,獎勵一臺iphone15s 當成績為[60-80]時,獎勵一本參考書 其他時,什么獎勵也沒有 prompt()可以彈出一個提示框,該提示框中會帶有一個文本框 用戶可以在文本框中輸入一段內容,該函數需要一個字符串作為參數 該字符串將會作為提示框的提示文字 用戶輸入的內容將會作為函數的返回值返回,可以定義一個變量來接收該內容
//score就是小明的期末成績
var score = prompt("請輸入小明的期末成績(0-100):");
//判斷值是否合法 (大于100 或則 小于0 或則 不是數字 都要拉出去斃了 )
if(score > 100 || score < 0 || isNaN(score)){
alert("拉出去斃了");
}
else{
//根據score的值來決定小明什么獎勵 if(score == 100){ alert("獎勵一倆BMW"); } else if(score >= 80){ alert("獎勵一臺iphone15s"); } else if(score >= 60){ alert("獎勵一本參考書"); } else{ alert("什么獎勵也沒有"); }
}
三十、if練習(二)
/* 大家都知道,男大當婚女大當嫁,那么女方家長要嫁女兒,當然要提出一定的條件 高:180cm以上, 富1000萬以上, 帥500以上 如果三個條件同事滿足,則"我一定要嫁給你" 如果三個條件有為真的情況,則:"嫁吧,比上不足,比下有余" 如果三個條件都不滿足,則:"不嫁" */ var height = prompt("請輸入你的身高(cm):"); var money = prompt("請輸入你的財富(萬):"); var face = prompt("請輸入你的顏值(px):"); // alert(height+","+money+","+face); //如果三個條件同事滿足,則"我一定要嫁給你"(同時滿足用于&&) if(height > 180 && money > 1000 && face > 500){ alert("我一定要嫁給你"); }else if(height > 180 || money > 1000 || face > 500){ //如果三個條件有為真的情況(有一個滿足用或||),則:"嫁吧,比上不足,比下有余" alert("嫁吧,比上不足,比下有余"); }else{ alert("不嫁"); }
三十一、if練習(三)
編寫程序,由鍵盤輸入三個整數分別存入變量num1,num2,num3
對他們進行排序,并且從小到大輸出
//獲取用戶的三個數 //prompt()函數的返回值是string類型的 //在prompt前加+轉換為number var num1 = +prompt("請輸入第一個數"); var num2 = +prompt("請輸入第二個數"); var num3 = +prompt("請輸入第三個數"); alert(typeof num1); if(num1 < num2 && num1 < num3){ //num1最小 比較num2 和 num3 if(num2 < num3){ //num1 num2 num3 alert(num1+","+num2+","+num3); }else{ //num1 num3 num2 alert(num1+","+num3+","+num2); } }else if(num2 < num1 && num2 < num3){ //num2最小 比較num1 和num3 if(num1 < num3){ //num2 num1 num3 alert(num2+","+num1+","+num3); }else{ //num2 num3 num1 alert(num2+","+num3+","+num1); } }else{ //num3最小 比較num1 和num2 if(num1 < num2){ //num3 num1 num2 alert(num3+","+num1+","+num2); }else{ //num3 num2 num1 alert(num3+","+num2+","+num1); } }
三十二、條件分支語句
條件分支語句也叫switch語句 語法: switch(條件表達式){ case 表達式: 語句... break; case 表達式: 語句... break; case 表達式: 語句... break; defsult: 語句... } 執行流程: switch...case...語句 在執行時會依次將case后的表達式的值和switch后的條件表達式的值進行全等比較 如果比較結果為true,則從當前case處開始執行代碼 當前case后的所有代碼都會被執行,我們可以在case的后面跟著一個break關鍵字 這樣可以確保只會執行當前case后的語句,而不會執行其他的case 如果比較結果為false,則繼續向下比較 如果所有的比較結果都為false,則只執行default后的語句 switch語句和if語句的功能實際上有重復的,使用switch可以實現if的功能 同樣使用if也可以實現switch的功能,所以我們使用時,可以根據自己的習慣選擇 //根據num的值,輸出對應的中文 var num = abc; /* if(num == 1){ console.log("壹"); }else if(num == 2){ console.log("貳"); } */ // 這倆中方法差不多 switch(num){ case 1: console.log("壹"); //使用break可以來退出switch語句 break; case 2: console.log("貳"); break; case 3: console.log("叁"); break; default : console.log("非法數字"); break; }
三十二、條件分支語句練習(二)
從鍵盤接收整數參數,如果該數為1-7,打印對應的星期,否則打印非法參數 var week = 2; switch(week){ case 1: console.log("星期一"); //使用break可以來退出switch語句 break; case 2: console.log("星期二"); break; case 3: console.log("星期三"); break; default : console.log("非法數字"); break; }
三十二、條件分支語句練習(一)
對于成績大于60分的,輸出"合格"。低于60分的,輸出"不合格"
//方法一:
var socre = 59; switch(parseInt(socre/10)){ case 10: case 9: case 8: case 7: case 6: console.log("合格"); break; default: console.log("不合格"); break; }
//方法二:
var socre = 59; switch(true){ case score >= 60: console.log("合格"); break; default: console.log("不合格"); break; }
三十三、while循環
/* 向頁面中輸出連續的數字 */ // var n = 1; // document.write(n++ +"
"); //輸出1 /* 循環語句: 通過循環語句可以反復的執行一段代碼多次 while循環 -語法 while(條件表達式){ 語句... } -while語句在執行時, 先對條件表達式進行求值判斷 如果值為true,則執行循環體 循環體執行完畢后,繼續對表達式進行判斷 如果為true,則繼續執行循環體,以此類推 如果值為flash,則終止循環 do...while循環 - 語法 do{ 語句... }while(條件表達式) - 執行流程: do...while語句在執行時,會先執行循環體 循環體執行完畢以后,在對while后的條件表達式進行判斷 如果結果為true,則繼續執行循環體,執行完畢繼續判斷以此類推 如果結果為false,則終止循環 實際上這倆個語句功能類似,不同的是while是先判斷后執行 而do...while會先執行后判斷 do...while可以保證循環體至少執行一次 而while不能 */
// 方法一
//向這種將條件表達式寫死為true的循環,叫做死循環 //該循環不會停止,除非瀏覽器關閉,死循環在開發中慎用 //可以使用break,來終止循環 var n = 1; while(true){ alert(n++); //判斷n是否是10 if(n == 10){ //退出循環 break; } }
//方法二
//創建一個循環,往往需要三個步驟 // 1.創建一個初始化的變量 var i = 0; //2.在循環中設置一個條件表達式 while(i < 10){ alert(i); //3.定義一個更新表達式,每次更新初始化變量 i++; }
//方法三
var i = 0; while(i < 10){ document.write(i++ +"
"); } // 輸出為換行的數字
//方法四
do{ socument.write(i++ +"
"); }while(i < 10);
三十四、while循環練習
/* 假如投資的幾年利率為5%,試求從1000塊增長到5000塊,需要花費多少年 1000 1000*1.05 1050 1050*1.05 */ //定義一個變量,表示當前的錢數 (代碼解析) var money = 1000; //定義一個計數器 var count = 0; //定義一個while循環來計算每年的錢數 while(money < 5000){ money *= 1.05; //使用count自增 count++; } console.log("一共需要"+count+"年"); // money *= 1.05 //money = money * 1.05 它倆一個意思 var money = 1000; var count = 0; while(money < 5000){ money *= 1.05; count++; } console.log("一共需要"+count+"年");
三十五、while練習(一) 使用if練習一
//將prompt放入到一個循環中
while(true){
//score就是小明的期末成績 var score = prompt("請輸入小明的期末成績(0-100):"); //判斷用戶輸入的值是否合法 if(score >= 0 && score <= 100){ //滿足該條件則證明用戶的輸入合法,退出循環 break; } alert("請輸入有效的分數");
}
//根據score的值來決定小明什么獎勵 if(score == 100){ alert("獎勵一倆BMW"); } else if(score >= 80){ alert("獎勵一臺iphone15s"); } else if(score >= 60){ alert("獎勵一本參考書"); } else{ alert("什么獎勵也沒有"); }
三十六、for循環
for語句,也是一個循環語句,也稱為for循環
在for循環中,為我們提供了專門的位置用來放三個表達式: 1.初始化表達式 2.條件表達式 3.更新表達式 for(初始化表達式;條件表達式;更新表達式){ 語句... } for循環的執行流程: 1.執行初始化表達式,初始化變量(初始化表達式只能則執行一次) 2.執行條件表達式,判斷是復執行循環 3.如果為true,則執行循環 如果為false,則終止循環 4.執行更新表達式,更新表達式執行完畢繼續重復執行 //方法一: //創建一個執行10次的while循環 //初始化表達式 var i = 0; // while(i < 10){ //設置更新表達式 alert(i++); } //方法二: for(i = 0 ; i < 10 ; i++){ alert(i); } //方法三: /* for循環中的三個部分都可以省略,也可以寫在外部 如果在for循環中不寫任何表達式,只寫倆個; 此時循環是一個死循環會一直執行下去,慎用 */ var i = 0; for(;i<10;){ alert(i++); }
三十七、for循環練習(一)
打印1-100之間所有奇數之和
//創建一個變量,用來保存奇數之和
var sum = 0; for(var i = 1 ; i <= 100 ; i++){ //判斷i是否是奇數 //不能被2整除的數就是奇數(==是偶數 !=是奇數) if(i%2 != 0){ //如果i除以2有余數則證明i是奇數 // console.log(i); sum = sum + i; } } //奇數總和2500 console.log("奇數之和:"+sum);
三十八、for循環練習(二)
打印1-100之間的所有7的倍數的個數及總和
//3.定義一個變量來保存組合 var sum = 0; //5.定義一個計數器,來記錄數量 var count = 0; for(var i = 1 ; i <= 100 ; i++){ // console.log(i); (1.先打印出1到100) //2.判斷i是否是7的倍數(輸出7的倍數) if(i%7 == 0){ // console.log(i); sum += i; //(4.求總和) count++; //(5.使計數器自增1) } } //輸出總和 console.log("總和為:"+sum); //合為735 //輸出總數量 console.log("總數量:"+count); //數量為14
三十九、for循環練習(三)
水仙花數
水仙花數是指一個3位數,它的每個位上的數字的3 次冪之和等于它本身 (例如: 1^3 + 5^3 + 3^3 = 153),請打印所有的水仙花數
//先打印所有的三位數
for(var i = 100 ; i < 1000 ; i++){ //獲取i的百位 十位 個位的數字 //獲取百位數 var bai = parseInt(i/100); //獲取十位上的數字 var shi = parseInt((i-bai*100)/10); //獲取個位上的數字 var ge = i % 10; //判斷i是否是水仙花數 if(bai*bai*bai+shi*shi*shi+ge*ge*ge == i){ console.log(i); //輸出的結果為153 370 371 407 } }
四十、質數練習
在頁面中接收一個用戶輸入的數字,并判斷該數是否是質數
質數:只能被1和它自身整除的數,1不是質數也不是合數,質數必須是大于1的自然數 var num = prompt("請輸入一個大于1的整數"); //判斷這個值是否合法 if(num <= 1){ alert("該數值不合法"); }else{ //創建一個變量來保存當前的數的狀態 //默認當前num是質數 var flag = true; //判斷num是否是質數 //獲取2-num之間的數 for(var i=2;i四十一、嵌套的for循環
/* 通過程序,在頁面中輸出如下的圖形 1 ***** ***** ***** ***** ***** 2 * 1 <1 i=0 ** 2 <2 i=1 *** 3 <3 i=2 **** 4 <4 i=3 ***** 5 <5 i=4 3 ***** 1 j<5(5-0) i=0 **** 2 j<4(5-1) i=1 *** 3 j<3(5-2) i=2 ** 4 j<2(5-3) i=3 * 5 J<1(5-4) i=4 */ /* 1 ***** ***** ***** ***** ***** */ //向body中輸出一個內容 //document.write("*****
"); (方法一) //document.write("*****
"); //document.write("*****
"); //通過一個for循環來輸出圖形 //這個for循環執行幾次,圖形的高度就是多少 //它可以用來控制圖形的高度 for (var i=0;i<5;i++){ //高 // document.write("*****
"); //方法二 //在循環的內部創建一個循環,用來控制圖形的寬度 //目前我們的外部的for循環執行1次,內部的就會執行5次 //內層循環可以來決定圖形的寬度,執行幾次圖從的寬度就是多少 for(var j=0;j<5;j++){ //寬 document.write("* "); // 空格 } //輸出一個換行 document.write("
"); //最終輸出一個5*5的*矩形 } /*2 * ** *** **** ***** */ for(var i=0;i<5;i++){ for(var j=0 ; j"); } //最終輸出一個梯形的* /* 3 ***** **** *** ** * */ for(var i=0 ; i<5 ; i++){ for(var j=0 ; j<5-i ; j++){ document.write("* "); } document.write("
"); }四十二、for循環練習(一)
1.打印99乘法表
//創建外層循環,用來控制乘法表的高度 for(var i=1; i<=9 ; i++){ //創建一個內層循環來控制圖形的寬度 for(var j=1 ; j<=i ; j++){ document.write(""+j+"*"+i+"="+i*j+""); } //輸出一個換行 document.write("
"); }