一、函數(shù)

// 最基礎(chǔ)的函數(shù)定義 function f1() {console.log('hello world!'); } f1(); // hello world!// 帶參數(shù)的函數(shù) function f2(name,age) {console.log("姓名 : " + name + " 年齡：" + age); } f2("jassin",18); // 姓名 : jassin 年齡：18// 帶返回值的函數(shù) function f3(arg1,arg2) {return arg1 + arg2; }var s = f3("jassin", "dulala"); console.log(s); // jassindulala// 匿名函數(shù) var sum = function(arg1,arg2){return arg1 + arg2; }; ret = sum(1,2); console.log(ret); // 3//自執(zhí)行函數(shù)（比較常用 (function (arg1,arg2) {console.log("自執(zhí)行函數(shù)" + (arg1 +arg2)); })(10,20); // 自執(zhí)行函數(shù)30

函數(shù)的定義

function 函數(shù)名 (參數(shù)){?<br> 函數(shù)體;return 返回值; }

功能說明：

可以使用變量、常量或表達式作為函數(shù)調(diào)用的參數(shù)
函數(shù)由關(guān)鍵字function定義
函數(shù)名的定義規(guī)則與標識符一致，大小寫是敏感的
返回值必須使用return
Function 類可以表示開發(fā)者定義的任何函數(shù)。

用 Function 類直接創(chuàng)建函數(shù)的語法如下：

var 函數(shù)名 = new Function("參數(shù)1","參數(shù)n","function_body");

雖然由于字符串的關(guān)系，第二種形式寫起來有些困難，但有助于理解函數(shù)只不過是一種引用類型，它們的行為與用 Function 類明確創(chuàng)建的函數(shù)行為是相同的。

?

?

函數(shù)的全局變量和局部變量

局部變量：

在JavaScript函數(shù)內(nèi)部聲明的變量（使用var）是局部變量，所以只能在函數(shù)內(nèi)部訪問它（該變量的作用域使是函數(shù)內(nèi)部）。只要函數(shù)運行完畢，本地變量就會被刪除。

全局變量：

在函數(shù)外聲明的變量是全局變量，網(wǎng)頁上所有腳本和函數(shù)都能訪問它。

變量生存周期：

JavaScript變量的生命期從它們被聲明的時間開始。

局部變量會在函數(shù)運行以后被刪除。

全局變量會在頁面關(guān)閉后刪除

// 1、 // 不推薦使用 (function (arg1,arg2) {n = 100; // 相當于定義了一個全局變量var m = 100;console.log(" i can forget to you " + (arg1 + arg2)); })(10,20);// 2、可以使用 var n; // 提前聲明要使用的全局變量 (function (arg1,arg2) {n = 100;var m = 100;console.log(" i can forget to you " + (arg1 + arg2)); })("can"," youcan");

作用域

首先在函數(shù)內(nèi)部查找變量，找不到則到外層函數(shù)查找

（執(zhí)行函數(shù)一定要去找函數(shù)定義的位置）

例子：

// 執(zhí)行函數(shù)一定要去找函數(shù)定義的位置 // 自己用找自己 var city = "beijing"; function f() {var city = "shanghai";function inner() {var city = "shenzhen";console.log(city);}inner(); } f(); sehnzhen// 自己沒有找上一級 var city = "beijing"; function bar() {console.log(city); } function f() {var city = "shanghai";return bar; } var ret = f(); ret();beijing

閉包

// 閉包 // 內(nèi)部函數(shù)可以訪問外部函數(shù) var city = "beijing"; function f() {var city = "shanghai"function inner() {console.log(city);}return inner; } var ret = f(); ret();// shanghai

二、Date對象

1、創(chuàng)建Date對象

//方法1：不指定參數(shù) var nowd1=new Date(); alert(nowd1.toLocaleString( )); //方法2：參數(shù)為日期字符串 var nowd2=new Date("2004/3/20 11:12"); alert(nowd2.toLocaleString( )); var nowd3=new Date("04/03/20 11:12"); alert(nowd3.toLocaleString( )); //方法3：參數(shù)為毫秒數(shù) var nowd3=new Date(5000); alert(nowd3.toLocaleString( )); alert(nowd3.toUTCString());//方法4：參數(shù)為年月日小時分鐘秒毫秒 var nowd4=new Date(2004,2,20,11,12,0,300); alert(nowd4.toLocaleString( ));//毫秒并不直接顯示

?Date對象的方法—獲取日期和時間（更多）

獲取日期和時間 getDate() 獲取日 getDay () 獲取星期 getMonth () 獲取月（0-11） getFullYear () 獲取完整年份 getYear () 獲取年 getHours () 獲取小時 getMinutes () 獲取分鐘 getSeconds () 獲取秒 getMilliseconds () 獲取毫秒 getTime () 返回累計毫秒數(shù)(從1970/1/1午夜)

例子：

function getCurrentDate(){//1. 創(chuàng)建Date對象var date = new Date(); //沒有填入任何參數(shù)那么就是當前時間//2. 獲得當前年份var year = date.getFullYear();//3. 獲得當前月份 js中月份是從0到11.var month = date.getMonth()+1;//4. 獲得當前日var day = date.getDate();//5. 獲得當前小時var hour = date.getHours();//6. 獲得當前分鐘var min = date.getMinutes();//7. 獲得當前秒var sec = date.getSeconds();//8. 獲得當前星期var week = date.getDay(); //沒有g(shù)etWeek// 2014年06月18日 15:40:30 星期三return year+"年"+changeNum(month)+"月"+day+"日 "+hour+":"+min+":"+sec+" "+parseWeek(week);}alert(getCurrentDate());//解決 自動補齊成兩位數(shù)字的方法function changeNum(num){if(num < 10){return "0"+num;}else{return num;}} //將數(shù)字 0~6 轉(zhuǎn)換成 星期日到星期六function parseWeek(week){var arr = ["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];// 0 1 2 3 .............return arr[week]; } View Code

Date對象的方法—設(shè)置日期和時間

//設(shè)置日期和時間 //setDate(day_of_month) 設(shè)置日 //setMonth (month) 設(shè)置月 //setFullYear (year) 設(shè)置年 //setHours (hour) 設(shè)置小時 //setMinutes (minute) 設(shè)置分鐘 //setSeconds (second) 設(shè)置秒 //setMillliseconds (ms) 設(shè)置毫秒(0-999) //setTime (allms) 設(shè)置累計毫秒(從1970/1/1午夜)var x=new Date(); x.setFullYear (1997); //設(shè)置年1997 x.setMonth(7); //設(shè)置月7 x.setDate(1); //設(shè)置日1 x.setHours(5); //設(shè)置小時5 x.setMinutes(12); //設(shè)置分鐘12 x.setSeconds(54); //設(shè)置秒54 x.setMilliseconds(230); //設(shè)置毫秒230 document.write(x.toLocaleString( )+"<br>"); //返回1997年8月1日5點12分54秒 x.setTime(870409430000); //設(shè)置累計毫秒數(shù) document.write(x.toLocaleString( )+"<br>"); //返回1997年8月1日12點23分50秒 View Code

Date對象的方法—日期和時間的轉(zhuǎn)換

日期和時間的轉(zhuǎn)換:getTimezoneOffset():8個時區(qū)×15度×4分/度=480; 返回本地時間與GMT的時間差，以分鐘為單位 toUTCString() 返回國際標準時間字符串 toLocalString() 返回本地格式時間字符串 Date.parse(x) 返回累計毫秒數(shù)(從1970/1/1午夜到本地時間) Date.UTC(x) 返回累計毫秒數(shù)(從1970/1/1午夜到國際時間) View Code

練習

將當前日期按“2017-12-27 11:11 星期三”格式輸出。

// 2017-12-27 11:11 星期三 function d() {// 創(chuàng)建Date 對象var date = new Date();// 獲取當前年份var year = date.getFullYear();// 獲取當前月份var month = date.getMonth()+1;// 獲取日var day = date.getDate();// 獲取小時var hour = date.getHours();// 獲取分鐘var minute = date.getMinutes();// 獲取星期var week = date.getDay();var weekStr = [ "星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"];if (month < 10){month = "0" + month;}console.log(year+"-"+month+"-"+day+" "+hour+":"+minute+" "+weekStr[week]) } d(); answer

?

三、序列化和反序列化（重要）

基礎(chǔ)

// JSON對象有兩個方法: JSON.parse()和JSON.stringify()方法， // 前者是將一個字符串解析為JSON對象，后者是將一個JSON對象轉(zhuǎn)換為一個字符串。var o= {"name":"jassin","age":18 }; // 序列化 var s = JSON.stringify(o); console.log(o,typeof o); // Object "object" console.log(s, typeof s); // {"name":"jassin","age":18} string// 反序列化 var obj =JSON.parse(s); console.log(obj, typeof obj); // {name: "jassin", age: 18} "object"//在使用JSON.stringify()時， // 如果對象中的值是function或是undefined，則在序列化為字符串時會會忽略掉這個鍵值對。如: var person = {"name":"jassin","age" : 18,"brother":undefined,"say": function () {alert("hello")} }; console.log(JSON.stringify(person));// {"name":"jassin","age":18}

?

// JSON.stringify()方法除要序列化的JavaScript 對象外，還可以接收另外兩個參數(shù)， 這兩個參數(shù)用于指定以不同的方式序列化JavaScript 對象。第一個參數(shù)是個過濾器，可以是一個數(shù)組， 也可以是一個函數(shù)；第二個參數(shù)是一個選項，表示是否在JSON 字符串中保留縮進。單獨或組合使用這兩個參數(shù)， 可以更全面深入地控制JSON 的序列化。// 1、如果過濾器參數(shù)是數(shù)組，那么JSON.stringify()的結(jié)果中將只包含數(shù)組中列出的屬性。如下: var person = {"name":"lishi","age":21,"brother":[{"name":"lili","age":18},{"name":"yan","age":22}],"sex" :"女","birthday": new Date(1996,12,20) }; var personStr = JSON.stringify(person,["name","brother","sex"]); console.log(personStr);// {"name":"lishi","brother":[{"name":"lili"},{"name":"yan"}],"sex":"女"}// 2、如果第二個參數(shù)是函數(shù)，行為會稍有不同。傳入的函數(shù)接收兩個參數(shù)，屬性（鍵）名和屬性值。 // 根據(jù)屬性（鍵）名可以知道應(yīng)該如何處理要序列化的對象中的屬性。屬性名只能是字符串， // 而在值并非鍵值對兒結(jié)構(gòu)的值時，鍵名可以是空字符串。為了改變序列化對象的結(jié)果， // 函數(shù)返回的值就是相應(yīng)鍵的值。不過要注意，如果函數(shù)返回了undefined，那么相應(yīng)的屬性會被忽略。 // 如下:var person = {"name": "莉莉","age":21,"sister":["妹妹","我也不知道"] }var personStr = JSON.stringify(person,function (key,value) {switch (key){case "sister":return value.join(",");case "age":return value + 1;default:return value;} }); console.log(personStr);// {"name":"莉莉","age":22,"sister":"妹妹,我也不知道"}// 3、JSON.stringify()方法的第三個參數(shù)用于控制結(jié)果中的縮進和空白符。 // 如果這個參數(shù)是一個數(shù)值，那它表示的是每個級別縮進的空格數(shù)。最大縮進空格數(shù)為10， // 所有大于10 的值都會自動轉(zhuǎn)換為10。如果縮進參數(shù)是一個字符串而非數(shù)值， // 則這個字符串將在JSON 字符串中被用作縮進字符（不再使用空格）。 // 縮進字符串最長不能超過10 個字符長。如果字符串長度超過了10 個，結(jié)果中將只出現(xiàn)前10 個字符。如 // : var person = {"name" : "lili","age" : 20,"sister" : ["哆啦A夢","皮卡丘"] }; // var personStr = JSON.stringify(person,null,4); // console.log(personStr); // { // "name": "lili", // "age": 20, // "sister": [ // "哆啦A夢", // "皮卡丘" // ] // }var personStr = JSON.stringify(person,null,"***"); console.log(personStr); // { // ***"name": "lili", // ***"age": 20, // ***"sister": [ // ******"哆啦A夢", // ******"皮卡丘" // ***] // } 探索

四、RegExp對象（正則）

1. Python里面：1. import re2. p1 = re.compile("^[a-zA-Z][a-zA-Z0-9_]{5,11}$")3. p1.match()4. p1.search()5. p1.findall() View Code

?

//RegExp對象//創(chuàng)建正則對象方式1 // 參數(shù)1 正則表達式 // 參數(shù)2 驗證模式：g(global)和i(忽略大小寫)// 用戶名只能是英文字母、數(shù)字和_，并且首字母必須是英文字母。長度最短不能少于6位 最長不能超過12位。// 創(chuàng)建RegExp對象方式 var reg1 = new RegExp("^[a-zA-Z][a-zA-Z0-9_]{5,11}$", "g");// 匹配響應(yīng)的字符串 var s1 = "bc123";//RegExp對象的test方法，測試一個字符串是否符合對應(yīng)的正則規(guī)則，返回值是true或false。 reg1.test(s1); // true

?

//方式一 var reg1 = new RegExp("^[a-zA-Z][a-zA-Z0-9_]{5,11}$", "g"); var s1 = "ba1223"; var s2 = "123alex"; console.log(reg1.test(s1)); console.log(reg1.test(s2));// true // false// 簡寫模式 var r2 = /^[a-zA-Z][a-zA-Z0-9_]{5,11}$/g; console.log(r2.test(s1)); console.log(r2.test(s2));// String對象與正則結(jié)合的4個方法 var s2 = "hello world";s1 = s2.match(/o/g); console.log(s1); // ["o", "o"] s3 = s2.search(/h/g); console.log(s3); // 0 s4 = s2.split(/o/g); console.log(s4); // ["hell", " w", "rld"] s5 = s2.replace(/o/g,"s"); console.log(s5); // hells wsrld// 關(guān)于匹配模式：g和i的簡單示例 var s1 = "name:lishi age:18"; s1 = s1.replace(/a/,"哈哈哈"); console.log(s1); // n哈哈哈me:lishi age:18 s2 = s1.replace(/a/g,"哈哈哈"); console.log(s2); // n哈哈哈me:lishi 哈哈哈ge:18 s3 = s1.replace(/a/gi,"哈哈哈"); console.log(s3); // n哈哈哈me:lishi 哈哈哈ge:18

?

?

五、Math對象

//該對象中的屬性方法 和數(shù)學有關(guān). abs(x) 返回數(shù)的絕對值。 exp(x) 返回 e 的指數(shù)。 floor(x)對數(shù)進行下舍入。 log(x) 返回數(shù)的自然對數(shù)（底為e）。 max(x,y) 返回 x 和 y 中的最高值。 min(x,y) 返回 x 和 y 中的最低值。 pow(x,y) 返回 x 的 y 次冪。 random() 返回 0 ~ 1 之間的隨機數(shù)。 round(x) 把數(shù)四舍五入為最接近的整數(shù)。 sin(x) 返回數(shù)的正弦。 sqrt(x) 返回數(shù)的平方根。 tan(x) 返回角的正切。//方法練習://alert(Math.random()); // 獲得隨機數(shù) 0~1 不包括1.//alert(Math.round(1.5)); // 四舍五入//練習：獲取1-100的隨機整數(shù)，包括1和100//var num=Math.random();//num=num*10;//num=Math.round(num);//alert(num)//============max min=========================/* alert(Math.max(1,2));// 2alert(Math.min(1,2));// 1 *///-------------pow--------------------------------alert(Math.pow(2,4));// pow 計算參數(shù)1 的參數(shù)2 次方.

?

轉(zhuǎn)載于:https://www.cnblogs.com/jassin-du/p/8120561.html

總結(jié)

以上是生活随笔為你收集整理的前端之JavaScript 02的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。