indexOf、instanceOf、typeOf、valueOf詳解

1、indexOf()

該方法用來返回某個指定的字符串值在字符串中首次出現的位置。

語法：indexOf(searchvalue,fromindex);兩個參數，參數一表示查詢的字符串值，參數二可選表示開始查詢的起始位置，若不寫默認從首字符開始查詢

var string = "abcdeADhu390u09";
console.log(string.indexOf("d"));//3  注意下標值從0開始
console.log(string.indexOf("D"));//6 

上面代碼都只有一個參數分別打印出"d"、"D"字符串值首次出現的位置，發現輸出的值不同，說明indexOf()方法對大小寫有區分。

下面這段代碼傳入兩個參數，根據前面說的參數二表示查詢的起始位置，所以從第五位開始查詢"d"首次出現的位置，查詢不到返回-1

console.log(string.indexOf("d",4));//-1

indexOf()方法還常用來判斷瀏覽器的類型，其用法如下：

if(navigator.userAgent.indexOf("Firefox")>0){
    return "Firefox";
}else if(navigator.userAgent.indexOf("Chrome")>0){
    return "Chrome";
}else if(navigator.userAgent.indexOf("Opera")>0){
    return "Opera";
}

以navigator.userAgent.indexOf("Opera")查詢來講，若打開的瀏覽器是歐朋則返回一個大於0的值，否則返回-1
2、instanceOf
該運算符用來檢測對象的類型
語法：object instanceof constructor   參數object表示要檢測的對象，參數constructor表示某個構造函數

function Person(){}
var Dave = new Person();
//Object.prototypeOf(Dave)===Person.prototype
console.log(Dave instanceof Person);//true

可以這樣理解：instanceof檢測constructor.prototype是否存在於參數object原型鏈上。若存在返回true
上面說的是較常規的用法，現在來看看在繼承中的用法

function Person(){};
function Student(){};
Student.prototype = new Person();//js中的原型繼承
var Dave = new Student();
console.log(Dave instanceof Student);//true
console.log(Dave instanceof Person);//true

上面一段代碼判斷Dave是否是Student的實例，並且是否是其父類型的實例

3、typeof

該運算符用來檢測基本數據類型

console.log(typeof("Json"));//string
console.log(typeof(2));//number
console.log(typeof(true));//boolean
console.log(typeof({a:1}));//object
console.log(typeof(function(){}));//function
6 console.log(typeof(undefined));//undefined

在ES6之前typeof返回值就是上面列出的六種：string、number、bollean、object、function、undefined;ES6出來后又增加了一種symbol

console.log(typeof(Symbol()));//symbol

4、valueOf()

該方法返回Boolean對象的原始值

語法：booleanObject.valueOf()

var boo = new Boolean(true);
console.log(boo.valueOf());

補充下與本章不相關的小知識點：

這里穿插一點"=="與"==="的小知識點

var a = undefined;
var b = null;
console.log(a==b);//true
console.log(a===b);//false

null與undefined在"=="情況下返回true,因為他們是類似的值，在"==="情況下返回false，因為他們不是相同類型的值。

特殊的還有

console.log(NaN==NaN);//false
console.log(3==NaN);//false

若有一個操作符是NaN，在"=="情況下返回false,即使兩個操作數都是NaN，在"=="情況下也返回false

console.log(false==0);//true
console.log(true==1);//true
console.log(true==2);//false

在操作符為"=="時，true與1返回true

console.log(null==0);//false
console.log(undefined==0);//false