深入解析JavaScript中的數(shù)據(jù)類型檢測方法及其

深入解析JavaScript中的數(shù)據(jù)類型檢測方法及其適用場景

avaScript中的數(shù)據(jù)類型檢測是一個重要的概念，它涉及到如何確定一個變量或者值的類型。在JavaScript中，有多種方法可以用來檢測數(shù)據(jù)類型，包括typeof、instanceof、Object.prototype.toString、Array.isArray和NaN判斷等。下面將詳細介紹這些數(shù)據(jù)類型檢測方案：

typeof

基本用法：typeof是一個內(nèi)置的操作符，用于檢測給定變量的數(shù)據(jù)類型。它可以返回如"number"、"string"、"boolean"、"object"、"function"和"undefined"等字符串。
用途與限制：typeof對于基本數(shù)據(jù)類型（如number、string、boolean、undefined、function）的檢測非?？煽?。然而，對于null和所有對象（包括數(shù)組和對象），typeof都會返回"object"，這可能導(dǎo)致一些誤判。

instanceof

基本用法：instanceof用于檢測構(gòu)造器函數(shù)的prototype屬性是否出現(xiàn)在某個對象的原型鏈上。如果是，則返回true；否則返回false。
用途與限制：instanceof適合用于自定義的對象類型檢測，因為它可以檢查一個對象是否是一個特定構(gòu)造器的實例。但對于原生對象類型（如Number、String、Boolean），在大多數(shù)情況下，使用instanceof并不是一個好主意，因為這些類型的構(gòu)造器函數(shù)并不保證能夠準(zhǔn)確識別出相應(yīng)類型的值。

Object.prototype.toString

基本用法：通過調(diào)用一個對象的Object.prototype.toString方法，可以得到一個格式化的字符串，這個字符串包含了對象的具體類型信息。
用途與限制：Object.prototype.toString.call(value)可以說是JavaScript中最準(zhǔn)確的類型檢測方法之一，能夠區(qū)分數(shù)組、null以及其他各種內(nèi)置對象。但是，這種方法需要記住的代碼比較多，語法也相對冗長。

Array.isArray

基本用法：Array.isArray(value)用于檢測給定的值是否是一個數(shù)組。
用途與限制：該方法專門用于數(shù)組的檢測，簡單且直接。但它只能用于檢測數(shù)組，對于其他類型的檢測無能為力。

NaN判斷

基本用法：在JavaScript中，NaN是一個特殊的值，表示“非數(shù)字”。由于NaN是唯一與自身不相等的值，因此可以使用value !==value來判斷一個值是否是NaN。此外，還可以使用Number.isNaN(value)來進行更準(zhǔn)確的判斷。
用途與限制：這種方法專用于檢測NaN，對于其他類型的檢測不適用。

綜上所述，JavaScript提供了多種數(shù)據(jù)類型檢測方案，每種方案都有其用途和限制。在實際開發(fā)中，應(yīng)根據(jù)具體需求選擇合適的方法來確保數(shù)據(jù)類型的正確判斷。

JavaScript中，有多種方法可以判斷一個變量的數(shù)據(jù)類型。以下是一些常見的方法：

typeof 操作符

typeof 是JavaScript中的一元操作符，返回一個表示未計算變量類型或已計算對象類型的字符串。但是，需要注意的是 typeof 對于 null 和 array 的處理可能不是你所期望的：

console.log(typeof undefined);    // "undefined"  
console.log(typeof 123);          // "number"  
console.log(typeof 'hello');      // "string"  
console.log(typeof true);         // "boolean"  
console.log(typeof {});           // "object"  
console.log(typeof []);           // "object" 而不是 "array"  
console.log(typeof null);         // "object" 而不是 "null"  
console.log(typeof function(){}); // "function"

instanceof 操作符

instanceof 操作符用于檢測構(gòu)造函數(shù)的 prototype 屬性是否出現(xiàn)在對象的原型鏈中的任何位置。這主要用于檢測對象是否屬于某個類。

console.log([] instanceof Array);  // true  
console.log(null instanceof Object); // false，因為 null 不是一個對象

Array.isArray() 方法

這是檢測一個值是否為數(shù)組的最佳方法。

console.log(Array.isArray([]));  // true  
console.log(Array.isArray({}));  // false

Object.prototype.toString.call() 方法

這個方法返回表示該對象的字符串。對于檢測原始值類型，特別是當(dāng) typeof 給出不直觀的結(jié)果時（如 null 和 array），這是一個很有用的方法。

function getType(obj) {  
    return Object.prototype.toString.call(obj).slice(8, -1);  
}  
  
console.log(getType(null));       // "Null"  
console.log(getType([]));         // "Array"  
console.log(getType({}));         // "Object"  
console.log(getType(123));        // "Number"  
console.log(getType('hello'));    // "String"  
console.log(getType(true));       // "Boolean"  
console.log(getType(undefined));  // "Undefined"

constructor 屬性

每個JavaScript對象都有一個 constructor 屬性，它指向創(chuàng)建該對象的構(gòu)造函數(shù)。但請注意，如果 constructor 被手動修改，則可能不準(zhǔn)確。

console.log(([]).constructor===Array);  // true  
console.log(({}).constructor===Object); // true

ES6 中的 Symbol.toStringTag

某些內(nèi)置對象（如 Array、Date、RegExp 等）的 @@toStringTag 屬性值是一個字符串，該字符串用于定制 Object.prototype.toString.call(obj) 的默認行為。但通常你不需要直接使用這個屬性，除非你在實現(xiàn)自定義對象并希望改變 Object.prototype.toString.call(obj) 的默認行為。

、typeof和 instanceof區(qū)別（必會）

在 javascript 中，判斷一個變量的類型可以用 typeof

1、數(shù)字類型、typeof 返回的值是 number。比如說：typeof(1)，返回值是 number
2、字符串類型，typeof 返回的值是 string。比如 typeof(“123”返回值是 string
3、布爾類型，typeof 返回的值是 boolean。比如 typeof(true)返回值是 boolean
4、對象、數(shù)組、null 返回的值是 object。比如 typeof(window)，typeof(document)，typeof(null)返回的值都是 object
5、函數(shù)類型，返回的值是 function。比如：typeof(eval)，typeof(Date)返回的值都是 function。
6、不存在的變量、函數(shù)或者 undefined，將返回 undefined。比如：typeof(abc)、typeof(undefined)都返回 undefined

在 javascript 中，instanceof 用于判斷某個對象是否被另一個函數(shù)構(gòu)造使用 typeof 運算符時采用引用類型存儲值會出現(xiàn)一個問題，無論引用的是什么類型的對象，它都返回”object”。ECMAScript 引入了另一個 Java 運算符 instanceof 來解決這個問題。

Instanceof 運算符與 typeof 運算符相似，用于識別正在處理的對象的類型。與 typeof 方法不同的是，instanceof 方法要求開發(fā)者明確地確認對象為某特定類型

2、js使用 typeof能得到的哪些類型？（必會）

typeof 只能區(qū)分值類型

typeof undefined // undefined
typeof null // object
typeof console.log // function
typeof NaN // number

3、解釋一下什么是回調(diào)函數(shù)，并提供一個簡單的例子？（必會）

軟件模塊之間總是存在著一定的接口，從調(diào)用方式上，可以把他們分為三類：同步調(diào)用 、回調(diào) 和 異步調(diào)用

同步調(diào)用 是一種阻塞式調(diào)用，調(diào)用方要等待對方執(zhí)行完畢才返回，它是一種單向調(diào)用；

回調(diào) 是一種雙向調(diào)用模式，也就是說，被調(diào)用方在接口被調(diào)用時也會調(diào)用對方的接口；

異步調(diào)用 是一種類似消息或事件的機制，不過它的調(diào)用方向剛好相反，接口的服務(wù)在收到某種訊息或發(fā)生某種事件時，會主動通知客戶方（即調(diào)用客戶方的接口）。回調(diào)和異步調(diào)用的關(guān)系非常緊密，通常我們使用回調(diào)來實現(xiàn)異步消息的注冊，通過異步調(diào)用來實現(xiàn)消息的通知。同步調(diào)用是三者當(dāng)中最簡單的，而回調(diào)又常常是異步調(diào)用的基礎(chǔ)，因此，下面我們著重討論回調(diào)機制在不同軟件架構(gòu)中的實現(xiàn)

回調(diào)函數(shù) 就是一個通過函數(shù)指針調(diào)用的函數(shù)。如果你把函數(shù)的指針（地址）作為參數(shù)傳遞給另一個函數(shù)，當(dāng)這個指針被用來調(diào)用其所指向的函數(shù)時，我們就說這是回調(diào)函數(shù)?；卣{(diào)函數(shù)不是由該函數(shù)的實現(xiàn)方直接調(diào)用，而是在特定的事件或條件發(fā)生時由另外的一方調(diào)用的，用于對該事件或條件進行響應(yīng)

案例：

#include<stdio.h>

//callbackTest.c
//1.定義函數(shù) onHeight（回調(diào)函數(shù)）
//@onHeight 函數(shù)名
//@height 參數(shù)
//@contex 上下文
void onHeight(double height, void *contex)
{
    printf("current height is %lf", height);
}

//2.定義 onHeight 函數(shù)的原型
//@CallbackFun 指向函數(shù)的指針類型
//@height 回調(diào)參數(shù)，當(dāng)有多個參數(shù)時，可以定義一個結(jié)構(gòu)體
//@contex 回調(diào)上下文，在 C 中一般傳入 nullptr，在 C++中可傳入對象指針
typedef void (*CallbackFun)(double height, void *contex);

//定義全局指針變量
CallbackFun m_pCallback;

//定義注冊回調(diào)函數(shù)
void registHeightCallback(CallbackFun callback, void *contex)
{
    m_pCallback=callback;
}

//定義調(diào)用函數(shù)
void printHeightFun(double height)
{
    m_pCallback(height, NULL);
}

//main 函數(shù)
int main()
{
    //注冊回調(diào)函數(shù) onHeight
    registHeightCallback(onHeight, NULL);

    //打印 height
    double h=99;
    printHeightFun(99);
}

4、什么是閉包？（必會）

“閉包就是能夠讀取其他函數(shù)內(nèi)部變量的函數(shù)。例如在 javascript 中，只有函數(shù)內(nèi)部的子函數(shù)才能讀取局部變量，所以閉包可以理解成“定義在一個函數(shù)內(nèi)部的函數(shù)“。在本質(zhì)上，閉包是將函數(shù)內(nèi)部和函數(shù)外部連接起來的橋梁?！?/span>

舉例：創(chuàng)建閉包最常見方式，就是在一個函數(shù)內(nèi)部創(chuàng)建另一個函數(shù)。下面例子中的 closure 就是一個閉包


function func(){ 
    var a=1 ,b=2;

    funciton closure(){ 
        return a + b; 
    } 
    return closure;
}

5、什么是內(nèi)存泄漏（必會）

內(nèi)存泄漏指任何對象在您不再擁有或需要它之后仍然存在

6、哪些操作會造成內(nèi)存泄漏？（必會）

1、垃圾回收器定期掃描對象，并計算引用了每個對象的其他對象的數(shù)量。如果一個對象的引用數(shù)量為 0（沒有其他對象引用過該對象），或?qū)υ搶ο蟮奈┮灰檬茄h(huán)的，那么該對象的內(nèi)存即可回收
2、setTimeout 的第一個參數(shù)使用字符串而非函數(shù)的話，會引發(fā)內(nèi)存泄漏
3、閉包、控制臺日志、循環(huán)（在兩個對象彼此引用且彼此保留時，就會產(chǎn)生一個循環(huán)）

7、JS內(nèi)存泄漏的解決方式（必會）

7.1 global variables：對未聲明的變量的引用在全局對象內(nèi)創(chuàng)建一個新變量。在瀏覽器中，全局對象就是 window。

function foo(arg) {
    bar='some text'; // 等同于 window.bar='some text';
}

解決：
創(chuàng)建意外的全局變量

function foo() {
    this.var1='potential accident'
}

可以在 JavaScript 文件開頭添加 “use strict”，使用嚴格模式。這樣在嚴格模式下解析 JavaScript 可以防止意外的全局變量
在使用完之后，對其賦值為 null 或者重新分配

7.2 被忘記的 Timers或者 callbacks

在 JavaScript 中使用 setInterval 非常常見

大多數(shù)庫都會提供觀察者或者其它工具來處理回調(diào)函數(shù)，在他們自己的實例變?yōu)椴豢蛇_時，會讓回調(diào)函數(shù)也變?yōu)椴豢蛇_的。對于 setInterval，下面這樣的代碼是非常常見的：

var serverData=loadData();

setInterval(function() {
    var renderer=document.getElementById('renderer');
    if(renderer) {
        renderer.innerHTML=JSON.stringify(serverData);
    }
}, 5000); //This will be executed every ~5 seconds.

這個例子闡述著timers 可能發(fā)生的情況：計時器會引用不再需要的節(jié)點或數(shù)據(jù)

7.3 閉包：一個可以訪問外部（封閉）函數(shù)變量的內(nèi)部函數(shù)

JavaScript 開發(fā)的一個關(guān)鍵方面就是閉包：一個可以訪問外部（封閉）函數(shù)變量的內(nèi)部函數(shù)。由于 JavaScript 運行時的實現(xiàn)細節(jié)，可以通過以下方式泄漏內(nèi)存：

var theThing=null;

var replaceThing=function () {

    var originalThing=theThing;

    var unused=function () {
        if (originalThing) // a reference to 'originalThing'
        console.log("hi");
    };

    theThing={
        longStr: new Array(1000000).join('*'),
        someMethod: function () {
            console.log("message");
        }
    };
};

setInterval(replaceThing, 1000);

7.4 DOM引用

有時候，在數(shù)據(jù)結(jié)構(gòu)中存儲 DOM 結(jié)構(gòu)是有用的。假設(shè)要快速更新表中的幾行內(nèi)容。將每行DOM 的引用存儲在字典或數(shù)組中可能是有意義的。當(dāng)這種情況發(fā)生時，就會保留同一 DOM 元素的兩份引用：一個在 DOM 樹種，另一個在字典中。如果將來某個時候你決定要刪除這些行，則需要讓兩個引用都不可達。

var elements={
    button: document.getElementById('button'),
    image: document.getElementById('image')
};

function doStuff() {
    elements.image.src='http://example.com/image_name.png';
}

function removeImage() {
    // The image is a direct child of the body element.
    document.body.removeChild(document.getElementById('image'));
    // At this point, we still have a reference to #button in the
    //global elements object. In other words, the button element is
    //still in memory and cannot be collected by the GC.
}

8、說說你對原型（prototype）理解（必會）

JavaScript 是一種通過原型實現(xiàn)繼承的語言與別的高級語言是有區(qū)別的，像 java，C#是通過類型決定繼承關(guān)系的，JavaScript 是的動態(tài)的弱類型語言，總之可以認為 JavaScript 中所有都是對象，在 JavaScript 中，原型也是一個對象，通過原型可以實現(xiàn)對象的屬性繼承，JavaScript 的對象中都包含了一個” prototype”內(nèi)部屬性，這個屬性所對應(yīng)的就是該對象的原型

“prototype”作為對象的內(nèi)部屬性，是不能被直接訪問的。所以為了方便查看一個對象的原型，Firefox 和 Chrome 內(nèi)核的 JavaScript 引擎中提供了”proto“這個非標(biāo)準(zhǔn)的訪問器（ECMA 新標(biāo)準(zhǔn)中引入了標(biāo)準(zhǔn)對象原型訪問器”Object.getPrototype(object)”）

原型的主要作用就是為了實現(xiàn)繼承與擴展對象

9、介紹下原型鏈（解決的是繼承問題嗎）（必會）

JavaScript 原型：每個對象都會在其內(nèi)部初始化一個屬性，就是 prototype(原型)

原型鏈：當(dāng)我們訪問一個對象的屬性時，如果這個對象內(nèi)部不存在這個屬性，那么他就會去 prototype 里找這個屬性，這個 prototype 又會有自己的 prototype，于是就這樣一直找下去，也就是我們平時所說的原型鏈的概念

特點：JavaScript 對象是通過引用來傳遞的，我們創(chuàng)建的每個新對象實體中并沒有一份屬于自己的原型副本。當(dāng)我們修改原型時，與之相關(guān)的對象也會繼承這一改變

10、簡單說說 js中的繼承（必會）

繼承有以下六種方法:

1、原型鏈繼承 JavaScript 實現(xiàn)繼承的基本思想：通過原型將一個引用類型繼承另一個引用類型的屬性和方法
2、借用構(gòu)造函數(shù)繼承(偽造對象或經(jīng)典繼承) JavaScript 實現(xiàn)繼承的基本思想：在子類構(gòu)造函數(shù)內(nèi)部調(diào)用超類型構(gòu)造函數(shù)。通過使用 apply() 和 call() 方法可以在新創(chuàng)建的子類對- 象上執(zhí)行構(gòu)造函數(shù)
3、組合繼承(原型+借用構(gòu)造)(偽經(jīng)典繼承) JavaScript 實現(xiàn)繼承的基本思想：將原型鏈和借用構(gòu)造函數(shù)的技術(shù)組合在一塊，從而發(fā)揮兩者之長的一種繼承模式將原型鏈和借用構(gòu)造函- 數(shù)的技術(shù)組合到一起，從而取長補短發(fā)揮兩者長處的一種繼承模式
4、型式繼承 JavaScript 實現(xiàn)繼承的基本思想：借助原型可以基于已有的對象創(chuàng)建新對象，同時還不必須因此創(chuàng)建自定義的類型
5、寄生式繼承 JavaScript 實現(xiàn)繼承的基本思想：創(chuàng)建一個僅用于封裝繼承過程的函數(shù)，該函數(shù)在內(nèi)部以某種方式來增強對象，最后再像真正是它做了所有工作一樣返回對象。寄生- 式繼承是原型式繼承的加強版
6、寄生組合式繼承 JavaScript 實現(xiàn)繼承的基本思想：通過借用函數(shù)來繼承屬性，通過原型鏈的混成形式來繼承方法

在線咨詢

上一篇：10、Django 新建ipa（通訊錄）項目
下一篇：在瀏覽器地址欄輸入一個URL網(wǎng)址后，網(wǎng)頁顯示經(jīng)歷了哪

您的項目需求

*請認真填寫需求信息，我們會在24小時內(nèi)與您取得聯(lián)系。

整合營銷服務(wù)商