Array

定義

陣列也是一個物件，是一個用來存盤資料的物件，和Object類似，但是它的存盤效率比普通物件要高，陣列中保存的內容我們稱為元素，陣列使用索引（index）來操作元素，索引指由0開始的整數，

陣列操作

//創建陣列
var arr = new Array();//使用內置物件Array
var arr2 = new Array(10);//表示創建一個長度為10 的陣列
var arr3 = [];
var arr4 = [];//表示創建一個陣列，陣列中只有一個元素 10

//向陣列中添加元素
//語法：陣列物件[索引] = 值;
arr[0] = 123;
arr[1] = "hello";
//創建陣列時直接添加元素
//語法：var arr = [元素1,元素2....元素N];
var arr = [123,"hello",true,null];

//獲取和修改陣列的長度
//使用length屬性來操作陣列的長度
//獲取長度：陣列.length，length獲取到的是陣列的最大索引+1
//對于連續的陣列，length獲取到的就是陣列中元素的個數
//修改陣列的長度：陣列.length = 新長度，如果修改后的length大于原長度，則多出的部分會空出來，如果修改后的length小于原長度，則原陣列中多出的元素會被洗掉
//向陣列的最后添加元素：陣列[陣列.length] = 值;

方法

• push()

  • 用來向陣列的末尾添加一個或多個元素，并回傳陣列新的長度
  • 語法：陣列.push(元素1,元素2,元素N)

• pop()

  • 用來洗掉陣列的最后一個元素，并回傳被洗掉的元素

• unshift()

  • 向陣列的前邊添加一個或多個元素，并回傳陣列的新的長度

• shift()

  • 洗掉陣列的前邊的一個元素，并回傳被洗掉的元素

• slice()

  • 可以從一個陣列中截取指定的元素
  • 該方法不會影響原陣列，而是將截取到的內容封裝為一個新的陣列并回傳
  • 引數：1.截取開始位置的索引（包括開始位置），2.截取結束位置的索引（不包括結束位置）
  • 第二個引數可以省略不寫，如果不寫則一直截取到最后
  • 引數可以傳遞一個負值，如果是負值，則從后往前數

• splice()

  • 可以用來洗掉陣列中指定元素，并使用新的元素替換，該方法會將洗掉的元素封裝到新陣列中回傳
  • 引數：1.洗掉開始位置的索引，2.洗掉的個數，3.第三個及以后，都是替換的元素，這些元素將會插入到開始位置索引的后邊

• concat()

  • 可以連接兩個或多個陣列，它不會影響原陣列，而是新陣列作為回傳值回傳

• join()

  • 可以將一個陣列轉換為一個字串
  • 引數： 需要一個字串作為引數，這個字串將會作為連接符來連接陣列中的元素，如果不指定連接符則默認使用

• reverse()

  • 可以用來反轉一個陣列，它會對原陣列產生影響

• sort()

  • 可以對一個陣列中的內容進行排序，默認是按照Unicode編碼進行排序，呼叫以后，會直接修改原陣列，

  • 可以自己指定排序的規則，需要一個回呼函式作為引數：

  • function(a,b){	
        //回呼函式中需要定義兩個形參
    	//使用哪個元素呼叫不確定，但是肯定的是在陣列中a一定在b前邊
    	//如果回傳一個大于0的值，則元素會交換位置
    	//如果回傳一個小于0的值，則元素不會交換位置
    	//如果回傳一個等于0的值，則認為兩個元素相等，不交換位置
    	//升序排列
    	//return a-b;
    	//降序排列
    	return b-a;
    }
    

陣列遍歷

遍歷陣列就是將陣列中元素都獲取到，一般情況我們都是使用for回圈來遍歷陣列，也可以使用forEach()方法來遍歷陣列（不兼容IE8）

陣列.forEach(function(value , index , obj){
	//在其中對三個引數做自己需要的操作
});
//forEach()方法需要一個回呼函式作為引數（函式由我們創建但不由我們呼叫，稱為回呼函式）
//陣列中有幾個元素，回呼函式就會被呼叫幾次，每次呼叫時，都會將遍歷到的資訊以實參的形式傳遞進來，
//我們可以定義形參來獲取這些資訊，value:正在遍歷的元素,index:正在遍歷元素的索引,obj:被遍歷物件

Date

定義

日期的物件，在JS中通過Date物件來表示一個時間，如果直接使用建構式創建一個Date物件，則會封裝為當前代碼的執行時間，

創建物件

//創建一個當前的時間物件
var d = new Date();
//創建一個指定的時間物件
var d = new Date("月/日/年 時:分:秒");

方法

• getDate()

  • 當前日期物件是幾日（1-31）

• toLocaleString()

  • 轉換成習慣的格式

• getDay()

  • 回傳當前日期物件時周幾（0-6）
  • 0 周日
  • 1 周一 ...

• getMonth()

  • 回傳當前日期物件的月份（0-11）

  • 0 一月 1 二月 ，，，

  • getFullYear()

    • 從 Date 物件以四位數字回傳年份，

  • getHours()

    • 回傳 Date 物件的小時 (0 ~ 23)，

  • getMinutes()

    • 回傳 Date 物件的分鐘 (0 ~ 59)，

  • getSeconds()

    • 回傳 Date 物件的秒數 (0 ~ 59)，

  • getMilliseconds()
    -回傳 Date 物件的毫秒(0 ~ 999)，

  • getTime()

    • 回傳當前日期物件的時間戳
    • 時間戳，指的是從1970年月1日 0時0分0秒，到現在時間的毫秒數
      計算機底層保存時間都是以時間戳的形式保存的，
    • 應用場景：使用毫秒數處理快取的效果（不有快取）

  • Date.now()

    • 可以獲取當前代碼執行時的時間戳

Math

屬于一個工具類，它不需要我們創建物件，它里邊封裝了屬性運算相關的常量和方法，我們可以直接使用它來進行數學運算相關的操作

方法

• Math.PI
  • 常量，圓周率
• Math.abs()
  • 絕對值運算
• Math.ceil()
  • 向上取整
• Math.floor()
  • 向下取整
• Math.round()
  • 四舍五入取整
• Math.random()
  • 生成一個0-1之間的亂數
  • 生成一個x-y之間的亂數
  • Math.round(Math.random()*(y-x)+x);
• Math.pow(x,y)
  • 求x的y次冪
• Math.sqrt()
  • 對一個數進行開方
• Math.max()
  • 求多個數中最大值
• Math.min()
  • 求多個數中的最小值

String

在底層字串是以字符陣列的形式保存

方法

• charAt()
  • 根據索引獲取指定的字符
• charCodeAt()
  • 根據索引獲取指定的字符編碼
• String.fromCharCode()
  • 使用建構式物件創建
  • 根據字符編碼獲取字符
  • 字符編碼必須是十進制
  • concat()
    • 可以用來連接兩個或多個字串
  • indexOf()、lastIndexOf()
    • 該方法可以檢索一個字串中是否含有指定內容
    • 需要一個字串作為引數，這個字串就是要檢索的內容，
      如果找到該內容，則會回傳其第一次出現的索引，如果沒有找到則回傳-1，
    • 可以指定一個第二個引數，來表示開始查找的位置
• indexOf()是從前向后找
• lastIndexOf()是從后向前找
• slice()
  • 可以從一個字串中截取指定的內容，并將截取到內容回傳，不會影響原變數
  • 引數：
    第一個：截取開始的位置（包括開始）
    第二個：截取結束的位置（不包括結束）
  • 可以省略第二個引數，如果省略則一直截取到最后
  • 可以傳負數，如果是負數則從后往前數
• substr()
  • 和slice()基本一致，不同的是它第二個引數不是索引，而是截取的數量
• substring()
  • 和slice()基本一致，不同的是它不能接受負值作為引數，如果設定一個負值，則會自動修正為0，
    substring()中如果第二個引數小于第一個，自動調整位置
• toLowerCase()
  • 將字串轉換為小寫并回傳
• toUpperCase()
  • 將字串轉換為大寫并回傳
• split()
  • 可以根據指定內容將一個字串拆分為一個陣列
  • 引數：
    • 需要一個字串作為引數，將會根據字串去拆分陣列
      如果傳遞一個空串作為引數，則會將每個字符都拆分為陣列中的一個元素
      可以接收一個正則運算式，此時會根據正則運算式去拆分陣列
• match()
  • 可以將字串中和正則運算式匹配的內容提取出來，并封裝到一個陣列中回傳
  • 默認情況下match只會找到第一個符合要求的內容，找到以后就停止檢索
    我們可以設定正則運算式為全域匹配模式，這也就會匹配到所有的內容
• replace()
  • 可以將字串中指定內容替換為新的內容，默認只替換第一個
  • 引數：
    • 第一個：被替換的內容，可以是一個正則運算式，設定全域模式替換全部
    • 第二個：替換的新內容
• search()
  • 可以搜索字串中是否含有指定內容
  • 如果搜索到指定內容，則會回傳第一次出現的索引，如果沒有則回傳-1
  • 可以根據正則運算式去字串中查找指定的內容
  • 可以接受正則運算式，將會根據該運算式查詢內容

包裝類

在JS中為我們提供了三個包裝類：String() Boolean() Number()

通過這三個包裝類可以創建基本資料型別的物件

var num = new Number(2);
var str = new String("hello");
var bool = new Boolean(true);

但是在實際應用中千萬不要這么干，因為如果使用基本資料型別的物件，在做比較操作時可能會出現錯誤，當我們去操作一個基本資料型別的屬性和方法時，決議器會臨時將其轉換為對應的包裝類，然后再去操作屬性和方法，
操作完成以后再將這個臨時物件進行銷毀，

標籤：JavaScript

上一篇：原生JS實作輪播圖

下一篇：vue專案實戰經驗匯總