1 - 對象

1.1 對象的相關(guān)概念

① 什么是對象？

在 JavaScript 中食呻，對象是一組無序的相關(guān)屬性和方法的集合流炕，對象是由屬性和方法組成。

• 屬性：事物的特征仅胞，在對象中用屬性來表示（常用名詞）
• 方法：事物的行為浪感，在對象中用方法來表示（常用動詞）

② 為什么需要對象？

保存一個值時饼问，可以使用變量影兽，保存多個值（一組值）時，可以使用數(shù)組莱革。如果要保存一個人的完整信息呢峻堰？例如讹开，將“張三瘋”的個人的信息保存在數(shù)組中的方式為：

var arr = ['張三瘋', '男', 128];

上述例子中用數(shù)組保存數(shù)據(jù)的缺點是：數(shù)據(jù)只能通過索引值訪問，開發(fā)者需要清晰的記住所有的數(shù)據(jù)的索引捐名，才能準(zhǔn)確地獲取數(shù)據(jù)旦万，而當(dāng)數(shù)據(jù)量龐大時，不可能做到記憶所有數(shù)據(jù)的索引值镶蹋。

為了讓更好地存儲一組數(shù)據(jù)成艘，對象應(yīng)運而生：對象中為每項數(shù)據(jù)設(shè)置了屬性名稱，可以訪問數(shù)據(jù)更語義化贺归，數(shù)據(jù)結(jié)構(gòu)清晰淆两，表意明顯，方便開發(fā)者使用拂酣。

使用對象記錄上組數(shù)據(jù)為：

var obj = {
  "name":"張三瘋",
  "sex":"男",
  "age":128,
  "height":154
}

JS中的對象表達(dá)結(jié)構(gòu)更清晰秋冰，更強大。

1.2 創(chuàng)建對象的三種方式

① 使用對象字面量創(chuàng)建對象

就是花括號 { } 里面包含了表達(dá)這個具體事物（對象）的屬性和方法婶熬；{ } 里面采取鍵值對的形式表示剑勾。

鍵：相當(dāng)于屬性名，值：相當(dāng)于屬性值赵颅，可以是任意類型的值（數(shù)字類型虽另、字符串類型、布爾類型饺谬，函數(shù)類型等）

代碼如下：

var star = {
    name : 'pink',
    age : 18,
    sex : '男',
    sayHi : function(){ // 匿名函數(shù)
        alert('大家好啊~');
    }
};

上述代碼中 star 即是創(chuàng)建的對象洲赵。

• 對象的屬性：對象中存儲具體數(shù)據(jù)的 "鍵值對"中的 "鍵"稱為對象的屬性，即對象中存儲具體數(shù)據(jù)的項

通過對象.屬性名 訪問對象的屬性商蕴，這個小點 . 就理解為“ 的 ”

console.log(star.name)     // 調(diào)用名字屬性

• 對象的方法：對象中存儲函數(shù)的 "鍵值對"中的 "鍵"稱為對象的方法，即對象中存儲函數(shù)的項

通過對象.方法名()調(diào)用對象的方法芝发，注意這個方法名字后面一定加括號

star.sayHi();           // 調(diào)用 sayHi 方法,注意绪商，一定不要忘記帶后面的括號

• 變量、函數(shù)辅鲸、屬性格郁、方法區(qū)別
  • 變量：單獨聲明賦值，單獨存在
  • 函數(shù)：單獨存在的独悴，通過“函數(shù)名()”的方式就可以調(diào)用
  • 屬性：對象里面的變量稱為屬性例书，不需要聲明，用來描述該對象的特征
  • 方法：對象里面的函數(shù)稱為方法刻炒，不需要聲明决采，使用“對象.方法名()”的方式就可以調(diào)用，方法用來描述該對象的行為和功能坟奥。

② 使用 new Object 創(chuàng)建對象

1. 創(chuàng)建空對象

var andy = new Obect();

通過內(nèi)置構(gòu)造函數(shù)Object()創(chuàng)建對象树瞭，此時andy變量已經(jīng)保存了創(chuàng)建出來的空對象拇厢。

2. 給空對象添加屬性和方法

在JS中，如果一個對象不存在某個屬性或方法晒喷，可以通過直接賦值來動態(tài)為對象增加屬性和方法孝偎。

andy.name = 'pink';
andy.age = 18;
andy.sex = '男';
andy.sayHi = function(){
    alert('大家好啊~');
}

③ 使用構(gòu)造函數(shù)創(chuàng)建對象（推薦使用）

構(gòu)造函數(shù)是一種特殊的函數(shù)，主要用來初始化對象凉敲，即為對象成員變量賦初始值衣盾，它總與 new 運算符一起使用。我們可以把對象中一些公共的屬性和方法抽取出來爷抓，然后封裝到這個函數(shù)里面势决。

構(gòu)造函數(shù)的封裝格式：

function 構(gòu)造函數(shù)名(形參1,形參2,形參3) {
     this.屬性名1 = 參數(shù)1;
     this.屬性名2 = 參數(shù)2;
     this.屬性名3 = 參數(shù)3;
     this.方法名 = 函數(shù)體;
}

構(gòu)造函數(shù)的調(diào)用格式

var obj = new 構(gòu)造函數(shù)名(實參1，實參2废赞，實參3)

以上代碼中徽龟，obj即接收到構(gòu)造函數(shù)創(chuàng)建出來的對象。

示例代碼如下：

// 構(gòu)造函數(shù)
function Stars(name, age, sex, sayH) { 
  this.name = name;
  this.age = age;
  this.sex = sex;
  this.sayH = sayH;
}
var sayH = function() {
  console.log('大家好啊~');
}
// 創(chuàng)建對象
var star = new Stars("pink", 18, '男', sayH);
console.log(star.name);
console.log(star.age);
console.log(star.sex);
console.log(star.sayH());
// 打影Φ亍：pink 18 男 大家好啊~

注意事項：

1. 構(gòu)造函數(shù)約定首字母要大寫据悔，并且使用駝峰命名。
2. 函數(shù)內(nèi)的屬性和方法前面需要添加 this耘沼，表示當(dāng)前對象的屬性和方法极颓。
3. 構(gòu)造函數(shù)中不需要 return 返回結(jié)果。
4. 當(dāng)我們創(chuàng)建對象的時候群嗤，必須用 new 來調(diào)用構(gòu)造函數(shù)菠隆。

new關(guān)鍵字的作用：

1. new 會在內(nèi)存中創(chuàng)建一個新的空對象
2. new 會讓 this 指向這個新的對象
3. 執(zhí)行構(gòu)造函數(shù)，目的：給這個新對象加屬性和方法
4. new 會返回這個新對象

1.3 函數(shù)內(nèi)部的 this 指向

1. 函數(shù)作為一個對象的方法狂秘，被該對象所調(diào)用骇径，那么 this 指向的是該對象。
2. 構(gòu)造函數(shù)中的 this 指向一個隱式對象者春，類似一個初始化的模型破衔，所有方法和屬性都掛載到了這個隱式對象身上，后續(xù)通過 new 關(guān)鍵字來調(diào)用钱烟，從而實現(xiàn)實例化晰筛。
3. 函數(shù)在定義的時候 this 指向是不確定的，只有在調(diào)用的時候才可以確定拴袭，如果是普通的函數(shù)調(diào)用读第，那么this指向全局 window，如果是構(gòu)造函數(shù)調(diào)用拥刻，那么this指向一個隱式對象怜瞒。

1.4 遍歷對象的屬性

原生JS中，for…in是專門為了遍歷對象設(shè)計的般哼。

var obj = {}; // 通過字面量盼砍，創(chuàng)建一個空對象
for (var i = 0; i < 10; i++) { // 使用for循環(huán)
obj[i] = i * 2; // 給空對象賦值
}

for(var key in obj) { // 遍歷對象的key和value
console.log(key + "==" + obj[key]); 
}

語法中的變量是自定義的尘吗，它需要符合命名規(guī)范，通常我們會將這個變量寫為 k 或者 key浇坐。

for (var k in obj) {
  console.log(k);      // 這里的 k 是屬性名
  console.log(obj[k]); // 這里的 obj[k] 是屬性值
}

1.5 Object.keys(對象) 獲取對象的屬性名數(shù)組

var obj = {
    id: 1,
    pname: '小米',
    price: 1999,
    num: 2000
};
var result = Object.keys(obj)
console.log(result); // [id睬捶，pname,price,num]

2 - 內(nèi)置對象

JavaScript 中的對象分為3種：自定義對象 、內(nèi)置對象近刘、 瀏覽器對象
JavaScript 提供了多個內(nèi)置對象：Math擒贸、 Date 、Array觉渴、String 等

2.1 Math對象

Math 是個對象介劫，不是構(gòu)造函數(shù)，Math 對象具有和數(shù)學(xué)相關(guān)的屬性和方法案淋，跟數(shù)學(xué)相關(guān)的運算（求絕對值座韵，取整、最大值等）可以使用 Math 中的成員踢京。

獲取指定范圍內(nèi)的隨機整數(shù)：

function getRandom(min, max) {
  return Math.floor(Math.random() * (max - min + 1)) + min; 
}

2.2 Date構(gòu)造函數(shù)

Date 是個構(gòu)造函數(shù)，不是對象瓣距，所以使用時需要 new Date() 實例化后才能使用其中具體方法和屬性黔帕，Date 實例用來處理日期和時間。

GMT是格林威治時間蹈丸，在零時區(qū)成黄，北京在東八區(qū)，比零時區(qū)快了八小時逻杖，所以 GMT+0800 是中國標(biāo)準(zhǔn)時間奋岁。

① Date();

• Date構(gòu)造函數(shù)不傳參數(shù)

// 如果不傳入?yún)?shù)，獲取的是當(dāng)前時間
var now = new Date();

• Date構(gòu)造函數(shù)傳參數(shù)

//傳入日期格式字符串
var future = new Date('2019/5/1');
var future = new Date('2019-5-1');
// Wed May 01 2019 00:00:00 GMT+0800 (中國標(biāo)準(zhǔn)時間)

//傳入毫秒數(shù)
var future = new Date(1498099000356);
// Thu Jun 22 2017 10:36:40 GMT+0800 (中國標(biāo)準(zhǔn)時間)

//傳入數(shù)字年荸百、月闻伶、日
var future = new Date(2018, 8, 25)
// Fri Sep 25 2018 00:00:00 GMT+0800 (中國標(biāo)準(zhǔn)時間)

② Date實例的方法和屬性

③ 通過Date實例獲取總毫秒數(shù)

總毫秒數(shù)的含義：基于1970年1月1日（世界標(biāo)準(zhǔn)時間）起的毫秒數(shù)。

方法1: Date.now()

Date對象的內(nèi)置方法

let a = Date.now();
console.log(a);     //1523619204809

方法2: getTime()

創(chuàng)建一個日期對象管搪，調(diào)用該對象的getTime()方法

let d = new Date().getTime()
console.log(d);     //1523619204809     

方法3: valueOf()

基于Date類型的valueOf()方法，不會返回一個字符串铡买，而是返回日期的毫秒表示

let c = new Date().valueOf();
console.log(c);     //1523619204809         

另外更鲁，基于Date類型valueOf()的特征，我們可以對兩個日期進(jìn)行比較大衅娉：

let a = new Date('2000-02');
let b = new Date('2010-02');

console.log(b > a);     //true

這里的b > a中的關(guān)系操作符> , b 和 a是對象,調(diào)用對象的valueOf()方法澡为，而Date類型的valueOf()會返回對應(yīng)的毫秒數(shù)，所以可以進(jìn)行比較景埃。

具體的有關(guān)大小比較的轉(zhuǎn)化規(guī)則媒至，之前博客有寫到顶别，JS中大于、小于的不同比較規(guī)則

方法4: + new Date()

let b = +new Date();
console.log(b);     //1523619204809         

+ new Date()結(jié)果為什么是毫秒數(shù)?

其實這個涉及到JS中另外一個知識點拒啰，一元操作符（+或者-）對 非數(shù)值 的轉(zhuǎn)換驯绎。

如果 + 號 應(yīng)用于對象之前，會首先調(diào)用找個對象的valueOf()谋旦、toString().

我們看一個例子:

let n = {
    valueOf: function(){
        return -1;
    }
}

console.log(+n)     // -1

+n調(diào)用了對象的valueOf()剩失，結(jié)果是 -1

所以 +new Date() 這個方法又回到了方法3中的 valueOf()，所以執(zhí)行結(jié)果是相同的册着。

④ 補充：JS中大于拴孤、小于的比較規(guī)則

1. 如果兩個操作數(shù)都是數(shù)值，則按照普通的數(shù)值比較

var result1 = 15 > 13; //true
var result2 = 15 < 13; //false
// 這幾個操作符返回的都是布爾型

2. 如果兩個操作數(shù)都是字符串甲捏，則比較兩個字符串對應(yīng)（兩個字符串中對應(yīng)位置的每個字符）的字符編碼值

var res1 = 'alpha go';
var res2 = 'Backhome';

alert(res1 > res2);  //true
//字母a的字符編碼是97, 字母B的字符編碼66

var res1 = '23';
var res2 = '3';

alert(res1 < res2);  //true
//'2'的字符編碼是50演熟，'3'的字符編碼是51

3. 如果一個操作數(shù)是數(shù)值，則會把另個操作數(shù)轉(zhuǎn)化為一個數(shù)值司顿，然后進(jìn)行數(shù)值比較

var res1 = '23';
var res2 = 3;

alert(res1 < res2); //false
// res1會轉(zhuǎn)化為數(shù)值23芒粹，23 > 3

4. 任何操作數(shù)與NaN比較，都是false

var res1 = 'a';
var res2 = 3;

alert(res1 < res2); //false,因為'a'轉(zhuǎn)化為了NaN
//任何操作數(shù)與NaN比較免猾，都是false
NaN < 10 //false
NaN >= 10 //false

一般來說是辕，如果一個值不小于另外個值，則一定是大于或者等于那個值猎提。特殊情況获三，在與NaN比較的時候，結(jié)果都返回false;

5. 如果有一個操作數(shù)是對象,調(diào)用這個對象的valueOf()方法锨苏，得到的結(jié)果按照前面的規(guī)則進(jìn)行比較疙教。如果對象沒有valueOf()方法，則調(diào)用toString()方法伞租，得到的結(jié)果按照前面的規(guī)則進(jìn)行比較贞谓。
6. 如果操作數(shù)是布爾值，則轉(zhuǎn)化為數(shù)值葵诈，再進(jìn)行比較裸弦。

⑤ Date相關(guān)案例

1. 寫一個函數(shù)，返回yyyy-MM-dd HH:mm:ss的形式

function formatDate(d) {
  //如果date不是日期對象作喘，返回
  if (!(date instanceof Date) {
    return;
  }
  var year = d.getFullYear(),
      month = d.getMonth() + 1, 
      date = d.getDate(), 
      hour = d.getHours(), 
      minute = d.getMinutes(), 
      second = d.getSeconds();
  month = month < 10 ? '0' + month : month;
  date = date < 10 ? '0' + date : date;
  hour = hour < 10 ? '0' + hour : hour;
  minute = minute < 10 ? '0' + minute:minute;
  second = second < 10 ? '0' + second:second;
  return year + '-' + month + '-' + date + ' ' + hour + ':' + minute + ':' + second;
}

2. 計算時間差理疙，返回相差的天/時/分/秒

function getInterval(start, end) {
  var day, hour, minute, second, interval;
  interval = end - start;
  interval /= 1000; // 將毫秒轉(zhuǎn)換成秒
  day = Math.round(interval / 60 / 60 / 24); // round取整
  hour = Math.round(interval / 60 / 60 % 24);
  minute = Math.round(interval / 60 % 60);
  second = Math.round(interval % 60);
  return {
    day: day,
    hour: hour,
    minute: minute,
    second: second
  }
}

2.3 Array數(shù)組對象

首先要知道數(shù)組是個對象。

① 創(chuàng)建數(shù)組的兩種方式

1. 字面量方式

// 1. 使用字面量創(chuàng)建數(shù)組對象
var arr = [1,"test",true];

2. new Array()

// 2. 使用構(gòu)造函數(shù)創(chuàng)建數(shù)組對象
var arr = new Array();

// 創(chuàng)建了一個數(shù)組泞坦，里面存放了3個字符串
var arr = new Array('zs', 'ls', 'ww');
console.log(arr.length); // 3

var arr = new Array(6);
console.log(arr.length); // 6
console.log(arr); // [空屬性 × 6]

注意：上面代碼中arr創(chuàng)建出的是一個空數(shù)組窖贤，如果需要使用構(gòu)造函數(shù)Array創(chuàng)建非空數(shù)組，可以在創(chuàng)建數(shù)組時傳入?yún)?shù)，參數(shù)傳遞規(guī)則如下：
① 如果只傳入一個參數(shù)赃梧，則參數(shù)規(guī)定了數(shù)組的長度
② 如果傳入了多個參數(shù)滤蝠，則參數(shù)稱為數(shù)組的元素

② 是否為數(shù)組

1. Array.isArray() 用于判斷一個對象是否為數(shù)組，isArray() 是 HTML5 中提供的方法

var arr = [1, 23];
var obj = {};
console.log(Array.isArray(arr));   // true
console.log(Array.isArray(obj));   // false

2. instanceof 運算符可以判斷一個對象是否是某個構(gòu)造函數(shù)的實例

3. typeof() 函數(shù)會判斷實例的真實類型

var arr = [1, 23];
var obj = {};
console.log(arr instanceof Array); // true
console.log(obj instanceof Array); // false

console.log(typeof(arr)); // object
console.log(typeof(obj)); // object

③ 數(shù)組的方法

1. 會修改原數(shù)組的方法

var numbers = [4, 2, 5, 1, 3];
var result = numbers.push('哈哈'); // 會修改原數(shù)組
console.log(numbers); // [4, 2, 5, 1, 3, '哈哈']
console.log(result); // 6

注意：sort方法需要傳入?yún)?shù)來設(shè)置升序授嘀、降序排序物咳，如果不傳參數(shù)，就是按字符編碼(Unicode)從小到大排序粤攒。

如果傳入function(a,b){ return a-b;}所森，則為升序，如果傳入function(a,b){ return b-a;}夯接，則為降序焕济。

var numbers = [4, 2, 5, 1, 3];
var result = numbers.sort(function(a, b) { // 會修改原數(shù)組
  return a - b; // 按照升序排列
});
console.log(numbers); // [1, 2, 3, 4, 5]
console.log(result); // [1, 2, 3, 4, 5]

//index:必需。規(guī)定從何處替換元素
//howmany:可選盔几。替換多少元素
//item1, ..., itemX:可選晴弃。要添加到數(shù)組的新元素，如果這個參數(shù)沒有逊拍，那就是把相應(yīng)的元素替換為空（刪除數(shù)組）上鞠。
array.splice(index,howmany,item1,.....,itemX) 

var numbers = [4, 2, 5, 1, 3];
var result = numbers.splice(1, 3, '哈哈', '嘿嘿'); // 會修改原數(shù)組
console.log(numbers); // [4, "哈哈", "嘿嘿", 3]
console.log(result); // [2, 5, 1] 返回值是替換出來的數(shù)組

var fruits = ["Banana", "Orange", "Apple", "Mango"];
// 因為會修改原數(shù)組芯丧，所以一般我們直接使用原數(shù)組芍阎，不用返回值，因為是一樣的
var newResult = fruits.reverse();
console.log(fruits); // ['Mango', 'Apple', 'Orange', 'Banana']
console.log(newResult); // ['Mango', 'Apple', 'Orange', 'Banana']

2. 不會修改原數(shù)組的方法

//item  必須萧锉。查找的元素珊随。
//start 可選的整數(shù)參數(shù)。規(guī)定在數(shù)組中開始檢索的位置柿隙。它的合法取值是 0 到 stringObject.length - 1叶洞。如省略該參數(shù)，則將從字符串的首字符開始檢索禀崖。
var numbers = [4, 2, 5, 1, 3];
var index = numbers.indexOf(5, 1); // 不會修改原數(shù)組
console.log(numbers); // [4, 2, 5, 1, 3]
console.log(index); // 2

var numbers = [4, 2, 5, 1, 3];
var result1 = numbers.toString(); // 不會修改原數(shù)組
var result2 = numbers.join('+'); // 不會修改原數(shù)組
console.log(numbers); // [4, 2, 5, 1, 3]
console.log(result1); // 字符串：4,2,5,1,3
console.log(result2); // 字符串：4+2+5+1+3

注意：join方法如果不傳入?yún)?shù)帆焕，則默認(rèn)按照 “ , ”拼接元素

arr.forEach(function(value, index, array) { // 沒有返回值
     //參數(shù)一是:數(shù)組元素
     //參數(shù)二是:數(shù)組元素的索引
     //參數(shù)三是:當(dāng)前的數(shù)組
})

filter() 方法返回一個新的數(shù)組叶雹，新數(shù)組中的元素是通過檢查指定數(shù)組中符合條件的所有元素财饥，主要用于篩選數(shù)組

var arr = [12, 66, 4, 88, 3, 7];
var newArr = arr.filter(function(value, index, array) {
   //參數(shù)一是:數(shù)組元素
   //參數(shù)二是:數(shù)組元素的索引
   //參數(shù)三是:當(dāng)前的數(shù)組
   return value >= 20;
});
console.log(arr); // 不會改變原數(shù)組
console.log(newArr); // [66,88] // 返回值是一個新數(shù)組

some() 方法用于檢測數(shù)組中的元素是否滿足指定條件，通俗來說就是查找數(shù)組中是否有滿足條件的元素折晦。注意它返回值是布爾值钥星，如果查找到這個元素，就返回true满着，如果查找不到就返回false谦炒。如果找到第一個滿足條件的元素，則終止循環(huán)风喇，不再繼續(xù)查找宁改。

var arr = [10, 30, 4];
var flag = arr.some(function(value, index, array) {
    //參數(shù)一是:數(shù)組元素
    //參數(shù)二是:數(shù)組元素的索引
    //參數(shù)三是:當(dāng)前的數(shù)組
    return value < 3;
});
console.log(arr); //不會修改原數(shù)組
console.log(flag); //false

var numbers1 = [4, 2, 5, 1, 3];
var numbers2 = ['jack', 'rose', 'lili'];
var result = numbers1.concat(numbers2); // 不會修改原數(shù)組
console.log(numbers1); // [4, 2, 5, 1, 3]
console.log(numbers2); // ['jack', 'rose', 'lili']
console.log(result); // [4, 2, 5, 1, 3, "jack", "rose", "lili"]

//start:必須。 截取的開始下標(biāo)
//end:可選魂莫。 截取的結(jié)束下標(biāo)
//注意: 截取的時候,包含start,不包含end
var numbers = [4, 2, 5, 1, 3];
var result = numbers.slice(1, 3);  // 不會修改原數(shù)組
console.log(numbers); // [4, 2, 5, 1, 3]
console.log(result); // [2, 5]

3. 清空數(shù)組

// 方式1
arr = [];
// 方式2
arr.length = 0;
// 方式3
arr.splice(0, arr.length);

④ 案例練習(xí)

1. 將一個字符串?dāng)?shù)組輸出為 | 分割的形式还蹲，比如 “ 劉備 | 張飛 | 關(guān)羽 ”。

var array = ['劉備', '關(guān)羽', '張飛'];
// 使用join()
console.log(array.join('-')) // 字符串：劉備-關(guān)羽-張飛

2. 將一個字符串?dāng)?shù)組的元素的順序進(jìn)行反轉(zhuǎn)耙考，["a", "b", "c", "d"] --> [ "d","c","b","a"]谜喊。

// 使用reverse()
var array = ['劉備', '關(guān)羽', '張飛'];
console.log(array.reverse()); // ["張飛", "關(guān)羽", "劉備"]

3. 工資的數(shù)組 [1500, 1200, 2000, 2100, 1800]，把工資超過2000的刪除倦始。

// 方式1：遍歷
var array =  [1500,1200,2000,2100,1800];
var tmpArray = [];
for (var i = 0; i < array.length; i++) {
  if(array[i] < 2000) {
    tmpArray.push(array[i]);
  }
}
console.log(tmpArray); // [1500, 1200, 1800]

// 方式2：filter
var array =  [1500, 1200, 2000, 2100, 1800];
var newArray = array.filter(function (item) {
  // item就是數(shù)組中的每一個元素
  return item < 2000;
})
console.log(newArray); // [1500, 1200, 1800]

4. ["c", "a", "z", "a", "x", "a"] 找到數(shù)組中每一個a出現(xiàn)的位置斗遏。

var array =  ['c', 'a', 'z', 'a', 'x', 'a'];
do {
  var index = array.indexOf('a',index + 1); // 第二個參數(shù)是從什么位置開始找
  if (index != -1){
    console.log(index); // 1 3 5
  }
} while (index > 0);

5. 編寫一個方法，去掉一個數(shù)組的重復(fù)元素鞋邑。

function clear(arr) {
  // 1 如何獲取數(shù)組中每一個元素出現(xiàn)的次數(shù)
  var o = {}; // 記錄數(shù)組中元素出現(xiàn)的次數(shù)
  for (var i = 0; i < arr.length; i++) {
    var item = arr[i]; // 數(shù)組中的每一個元素
    // o[item] = 1;
    // 判斷o對象是否有當(dāng)前遍歷到的屬性
    if (o[item]) {
      // 如果o[item] 存在诵次，說明次數(shù)不為1
      o[item]++;
    } else {
      // 如果o[item] 不存在，說明是第一次出現(xiàn)
      o[item] = 1;
    }
  }
  // console.log(o);
  // 2 生成一個新的數(shù)組炫狱，存儲不重復(fù)的元素
  var newArray = [];
  // 遍歷對象o中的所有屬性
  for (var key in o) {
    // 判斷o對象中當(dāng)前屬性的值是否為 1  如果為1 說明不重復(fù)直接放到新數(shù)組中
    if (o[key] === 1) {
      newArray.push(key);
    } else {
      // o對象中當(dāng)前屬性 次數(shù)不為1 藻懒，說明有重復(fù)的，如果有重復(fù)的話视译，只存儲一次
      // 判斷當(dāng)前的newArray數(shù)組中是否已經(jīng)有該元素  
      if (newArray.indexOf(key) === -1) {
        newArray.push(key);
      }
    }
  }
  return newArray;
} 

var array = ['c', 'a', 'z', 'a', 'x', 'a'];
var newArray = clear(array);
console.log(newArray);  // 結(jié)果：["c", "a", "z", "x"]

2.4 基本包裝類型：String嬉荆、Number、Boolean

上面我們說過酷含，簡單數(shù)據(jù)類型包括 String鄙早、Number、Boolean椅亚、Undefined限番、Null。為了方便操作簡單數(shù)據(jù)類型呀舔，JavaScript 還提供了三個特殊的引用類型：String弥虐、Number和Boolean扩灯。基本包裝類型就是把簡單數(shù)據(jù)類型包裝成復(fù)雜數(shù)據(jù)類型（也就是對象）霜瘪，這樣基本數(shù)據(jù)類型就有了屬性和方法珠插。

又因為通過 typeof 獲取的簡單數(shù)據(jù)類型的類型如下，可以看出 null 就是對象類型颖对，如下：

typeof 返回的是字符串捻撑，有6種結(jié)果："string","number","boolean","object","function","undefined"，函數(shù)也是對象缤底。

所以我們總結(jié)：除了undefined顾患，所有的js類型都是對象類型，包括數(shù)組等等个唧。

下面代碼有問題嗎江解？沒問題，為什么沒問題徙歼？

var s1 = 'zhangsan';
var s2 = s1.substring(5);

s1 是簡單數(shù)據(jù)類型膘流，簡單數(shù)據(jù)類型是沒有方法的，但是為什么 s1 可以調(diào)用 substring(5) 呢鲁沥？

當(dāng)調(diào)用 s1.substring(5) 的時候呼股，先把 s1 包裝成 String 類型的臨時對象，再調(diào)用 substring 方法画恰，最后銷毀臨時對象彭谁，相當(dāng)于：

// 1. 生成臨時變量，把簡單類型包裝為復(fù)雜數(shù)據(jù)類型允扇，賦值給我們聲明的字符變量
var s1 = new String('zhangsan');
// 2. 進(jìn)行字符串操作
var s2 = s1.substring(5);
// 3. 最后銷毀臨時變量
s1 = null;

對于 String疤孕、Number和Boolean 的基本包裝類型的對象壕吹，我們也可以手動創(chuàng)建：

// 創(chuàng)建字符串對象
var str = new String('Hello World');
// 獲取字符串中字符的個數(shù)
console.log(str.length);

// 創(chuàng)建Number對象
var num = 18;                   //數(shù)值迟杂，基本類型
var num = Number('18');     //將字符串'18'轉(zhuǎn)換成Number類型的18
var num = new Number(18); //基本包裝類型蓬蝶，對象
var realNum = num.PrimitiveValue // 對象中的PrimitiveValue就是原始值，就是18

對于Boolean的基本包裝類型我們幾乎不用糊治，因為有可能引起歧義唱矛，如下：

var b1 = new Boolean(false); // 對象中包裝的是false
var b2 = b1 && true;        // true
// 雖然語法上沒啥毛病，但是包裝 false 的對象 && true井辜，最后結(jié)果還是 true绎谦，總給人感覺怪怪的，所以我們不這樣用

2.5 String字符串對象

① 字符串的不可變

字符串通過基本包裝類型可以調(diào)用部分方法來操作字符串粥脚，字符串所有的方法都不會修改字符串本身（字符串是不可變的）窃肠，操作完成會返回一個新的字符串。

字符串的不可變指的是里面的值不可變刷允，雖然看上去可以改變內(nèi)容冤留，但其實是地址變了碧囊，內(nèi)存中新開辟了一個內(nèi)存空間。

var str = 'abc'; // 指針str指向'abc'的內(nèi)存
str = 'hello'; // 重新開辟內(nèi)存存放'hello'纤怒，并更改str指針的指向呕臂，使其指向'hello'

由于字符串的不可變，在大量拼接字符串的時候會有效率問題肪跋。

② 字符串的方法

1. 根據(jù)字符返回位置 indexOf()

indexOf('要查找的字符', 開始的位置) //返回指定內(nèi)容在原字符串中的位置，從前往后找土砂，只找第一個匹配的州既，找不到返回-1
lastIndexOf() // 從后往前找，只找第一個匹配的萝映，找不到返回-1

案例練習(xí)：查找字符串"abcoefoxyozzopp"中所有o出現(xiàn)的位置以及次數(shù)

1. 先查找第一個o出現(xiàn)的位置
2. 然后 只要indexOf 返回的結(jié)果不是 -1 就繼續(xù)往后查找
3. 因為indexOf 只能查找到第一個吴叶，所以后面的查找，利用第二個參數(shù)序臂，當(dāng)前索引加1蚌卤，從而繼續(xù)查找

var s = 'abcoefoxyozzopp';
var array = [];
do {
  var index = s.indexOf('o', index + 1);
  if (index != -1) {
    array.push(index);
  }
} while (index > -1);
console.log(array); // [3, 6, 9, 12]

2. 根據(jù)位置返回字符 charAt(index)

字符串通過基本包裝類型可以調(diào)用部分方法來操作字符串，以下是根據(jù)位置返回指定位置上的字符：

案例練習(xí)：判斷一個字符串 'abcoefoxyozzopp' 中出現(xiàn)次數(shù)最多的字符奥秆，并統(tǒng)計其次數(shù)

1. 核心算法：利用 charAt() 遍歷這個字符串
2. 把每個字符都存儲給對象逊彭，如果對象沒有該屬性，就為1构订，如果存在了就 +1
3. 遍歷對象侮叮，得到最大值和該字符

注意：在遍歷的過程中，把字符串中的每個字符作為對象的屬性存儲在對象中悼瘾，對應(yīng)的屬性值是該字符出現(xiàn)的次數(shù)

var s = 'abcoefoxyozzopp';
var o = {};

for (var i = 0; i < s.length; i++) {
  var item = s.charAt(i);
  if (o[item]) { //如果對象中有這個屬性
    o[item] ++;  //就加1
  } else {
    o[item] = 1; //否則就為1
  }
}
//上面循環(huán)結(jié)束之后囊榜，o對象中就存儲了每個字符出現(xiàn)的次數(shù)

var max = 0;
var char ;
for(var key in o) {
  if (max < o[key]) {
    max = o[key];
    char = key;
  }
}

console.log(max); // 4
console.log(char); // o

3. 字符串操作方法 substr(start,length) slice(start,end)

字符串所有的方法，都不會修改字符串本身（字符串是不可變的）亥宿，操作完成會返回一個新的字符串卸勺，以下是部分操作方法：

案例練習(xí)：截取字符串"我愛中華人民共和國"，中的"中華"

var s = "我愛中華人民共和國";
s = s.substr(2,2);
console.log(s); // 中華

4. 大小寫轉(zhuǎn)換方法

toUpperCase()   //轉(zhuǎn)換大寫
toLowerCase()   //轉(zhuǎn)換小寫

5. 替換字符串 replace()方法

replace() 方法用于在字符串中用一些字符替換另一些字符烫扼，其使用格式如下：

字符串.replace(被替換的字符串曙求， 要替換為的字符串)； //替換映企，只能替換一次 

案例練習(xí)：把字符串中所有的 o 替換成 !

var s = 'abcoefoxyozzopp';
var index = -1;
do {
  index = s.indexOf('o', index + 1);
  if (index !== -1) {
    // 將 o 替換為 !
    s = s.replace('o', '!');
  }
} while(index !== -1);
console.log(s); // abc!ef!xy!zz!pp

6. 分割字符串圆到，結(jié)果是數(shù)組 split()

split()方法用于分割字符串，它可以將字符串分割為數(shù)組卑吭。在切分完畢之后芽淡，返回的是一個新數(shù)組。

其使用格式如下：

字符串.split("分割字符")

案例練習(xí)：把字符串中的所有空白去掉 ' abc xyz a 123 '

var s = '   abc       xyz  a    123   ';   
var arr = s.split(' '); // 通過空格截取豆赏，截取后的內(nèi)容放到一個數(shù)組里面
console.log(arr.join('')); // abcxyza123
// 或者：s = s.replace(' ', '');

③ 綜合案例：獲取url中?后面的內(nèi)容挣菲，并轉(zhuǎn)化成對象的形式

獲取url中?后面的內(nèi)容富稻，并轉(zhuǎn)化成對象的形式。例如：http://www.itheima.com/login?name=zs&age=18&a=1&b=2

var url = 'http://www.itheima.com/login?name=zs&age=18&a=1&b=2';
// 獲取url后面的參數(shù)
function getParams(url) {
  // 獲取?后面第一個字符的索引
  var index = url.indexOf('?') + 1;
  // url中?后面的字符串 name=zs&age=18&a=1&b=2
  var params = url.substr(index);
  // 使用&切割字符串白胀，返回一個數(shù)組 
  var arr = params.split('&');
  var o = {};
  // 數(shù)組中每一項的樣子name=zs
  for (var i = 0; i < arr.length; i++) {
    var tmpArr = arr[i].split('='); // 使用'='截取
    var key = tmpArr[0];
    var value = tmpArr[1];
    o[key] = value;
  }
  return o;
}

var obj = getParams(url);
console.log(obj); // {name: "zs", age: "18", a: "1", b: "2"}

console.log(obj.name); // zs
console.log(obj.age); // 18

3 - 簡單數(shù)據(jù)類型和復(fù)雜數(shù)據(jù)類型

3.1 js 的數(shù)據(jù)類型

關(guān)于數(shù)據(jù)類型椭赋，在本文的前面已經(jīng)講過了。

簡單數(shù)據(jù)類型：在存儲時變量中存儲的是值本身或杠，包括string 哪怔，number，boolean向抢，undefined认境，null。是值類型挟鸠。
復(fù)雜數(shù)據(jù)類型：在存儲時變量中存儲的僅僅是地址（引用）叉信，通過 new 關(guān)鍵字創(chuàng)建的對象（系統(tǒng)對象、自定義對象）艘希，如 Object硼身、Array、Date等覆享。是引用類型佳遂。

3.2 堆棧

棧：由操作系統(tǒng)自動分配釋放存放函數(shù)的參數(shù)值、局部變量的值等撒顿。其操作方式類似于數(shù)據(jù)結(jié)構(gòu)中的棧讶迁。
堆：存儲復(fù)雜類型(對象)，一般由程序員分配釋放核蘸，若程序員不釋放巍糯，由垃圾回收機制回收。

簡單數(shù)據(jù)類型變量的數(shù)據(jù)直接存放在變量（椏驮空間）中祟峦。

復(fù)雜數(shù)據(jù)類型變量（棧空間）里存放的是地址徙鱼，真正的對象實例存放在堆空間中宅楞。

3.3 簡單數(shù)據(jù)類型傳參 - 值傳遞

當(dāng)我們把一個值類型變量作為參數(shù)傳給函數(shù)的形參時，其實是把變量在椄み海空間里的值復(fù)制了一份給形參厌衙，那么在方法內(nèi)部對形參做任何修改，都不會影響到的外部變量绞绒。

function fn(a) {
    a++;
    console.log(a);
}
var x = 10;
fn(x); // 11
console.log(x); // 10
// 打由粝！：11 10

運行結(jié)果如下：

3.4 復(fù)雜數(shù)據(jù)類型傳參 - 指針傳遞

當(dāng)我們把引用類型變量傳給形參時，其實是把變量在椗詈猓空間里保存的堆地址復(fù)制給了形參喻杈，形參和實參其實保存的是同一個堆地址彤枢，所以操作的是同一個對象。

function Person(name) {
    this.name = name;
}
function f1(x) { // x = p
    console.log(x.name); // 2. 劉德華
    x.name = "張學(xué)友";
    console.log(x.name); // 3. 張學(xué)友
}
var p = new Person("劉德華");
console.log(p.name);    // 1. 劉德華
f1(p);
console.log(p.name);    // 4. 張學(xué)友

運行結(jié)果如下：

總結(jié)：對于函數(shù)傳參筒饰，簡單數(shù)據(jù)類型傳遞的是值缴啡，復(fù)雜數(shù)據(jù)類型傳遞的是指針。

3.5 案例練習(xí)

下面代碼輸出的結(jié)果?

function Person(name,age,salary) {
  this.name = name;
  this.age = age;
  this.salary = salary;
}
function f1(person) { // ③ 這時候p指針瓷们、person指針存儲的地址都是0xaabb业栅，都指向?qū)ο髉
  person.name = "ls"; 
  person = new Person("ww",20,10); // ④ person指針存儲的地址變成了0xaacc，指向person對象
  console.log(person.name); // ww
}

var p = new Person("zs",18,1000); // ① p指針存儲的地址是0xaabb谬晕，指向?qū)ο髉
console.log(p.name); // zs
f1(p); // ② 調(diào)用f1函數(shù)
console.log(p.name); // ls

// 打拥庠！：zs ww ls

內(nèi)存圖如下：