SlideShare una empresa de Scribd logo
1 de 4
JavaScript typeof and instanceof –
the concept and differences
For the actual blog post link visit : http://jbkflex.wordpress.com/2013/05/09/javascript-typeof-and-
instanceof-the-concept-and-differences/
As a JavaScript developer you must have used the typeof and the instanceof operator sometime in your code to
detect the the type of a variable in your program logic. And most often or not you might have been confused with
the different results that show up while expecting a desired result. In this post I am gonna show you an easy
technique to determine the type and instance of a variable. Let’s see some examples first.
The typeof operator
var str1 = "Hello, how are you?";
typeof str1;
Output: "string"
So, we have a string literal str1, and when we find the typeof str1, it gives “string”. Remember string is a primitive
data type in JavaScript. Let’s see another example,
var str2 = new String("I am doing good. Thank you!");
typeof str2;
Output: "object"
Now, we have a String Object and we have created an instance of that Object using the new operator, which is str2.
Now if we do a typeof, it gives object. Remember that in JavaScript, other than the primitive data types (and null,
undefined, function), everything else is an Object. So as expected you get the type as object.
Now, let’s work with Array’s and try the same thing,
var arr1 = [2,3,4]; //defining an array literal
typeof arr1;
Output: "object"
var arr2 = new Array(4,5,6); //creating an Array Object instance
typeof arr2;
Output: "object"
Firstly, we have an Array literal – arr1 and if we do a typeof it gives “object”. Why? Since Array’s are Objects and
they are not part of the primitive data set.
The next example is more obvious, we create an Array Object instance – arr2, and then do a typeof. As expected we
get a “object”. So we have seen, if the typeof does not return a primitive data type (which are number, boolean,
string), it will return an object. There are some special cases though, look at the bottom of this page to find out.
The instanceof operator
Now let’s take up some examples of the instanceof operator.
var str1 = "Hello, how are you?"; //defining a string literal, same as above
str1 instanceof String;
Output: false
If you see above, we have a string literal and when we do a instanceof to check if the variable is an instance of the
String Object, it returns false. Since a string literal belongs to the string primitive data type. Now, consider the
example below,
var str2 = new String("I am doing good. Thank you!"); //defining a String
object instance
str2 instanceof String;
Output: true
Here, str2 is actually an instance, so the test returns true.
But What’s up with the Array’s though? Let’s see,
var arr1 = [2,3,4]; //defining an array literal
arr1 instanceof Array;
Output: true
var arr2 = new Array(4,5,6); //creating an Array Object instance
arr2 instanceof Array;
Output: true
Both returns true as both arr1 and arr2 are Array objects and they are not part of the primitve data set.
In fact the following test also returns true
arr1 instanceof Object;
Output: true
arr2 instanceof Object;
Output: true
This is because the Array object inherits from the more generic Object object. (Yes, you heard it right Object
object!).
Still confused about finding types and instances? Here is the rule to do it easily.
Rule for the test
So, how do you guess if a variable is an instance of its Object or Type. Here is the rule,
1) First check the type of the variable using typeof.
2) Now do the instanceof test.
3) a) If the typeof test returns a primitive type – number, boolean, string. Then instanceof test will return false.
Because these are just primitive type data. They are not instances of any Object.
b) But if typeof returns an object, then instanceof test will return true. So you know that you are dealing with
objects and instances.
For eg.
var regexp = /d{3}/; //define a regular expression object
typeof regexp; -> "object", not a primitive type
regexp instanceof RegExp; -> true
regexp instanceof Object; -> true
Take another,
var str = "Hello, me again!";
typeof str; -> "string" , a primitive type
str instanceof String; -> false
Now, you can think of some examples and put the rule to a test.
Special cases
1) typeof null = “object” , since null is a special value in JavaScript which represents emptyness and it does not
have any type.
2) typeof undefined = “undefined”, as expected
3) typeof NaN = number, since NaN is actually a special number, although it says Not a Number. Confusing? Just
keep in mind.
4) typeof Function = “function”
5) typeof xmlObj = “xml”
References
1) typeof operator : https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Operators/typeof
2) instanceof operator: https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Operators/instanceof

Más contenido relacionado

Último

Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Safe Software
 
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Victor Rentea
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
WSO2
 

Último (20)

MS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectorsMS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectors
 
ICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesICT role in 21st century education and its challenges
ICT role in 21st century education and its challenges
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
 
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamDEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor Presentation
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
Cyberprint. Dark Pink Apt Group [EN].pdf
Cyberprint. Dark Pink Apt Group [EN].pdfCyberprint. Dark Pink Apt Group [EN].pdf
Cyberprint. Dark Pink Apt Group [EN].pdf
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
 
CNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In PakistanCNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In Pakistan
 
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, AdobeApidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
 
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
 
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptx
 
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin WoodPolkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
 

Destacado

How Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental HealthHow Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental Health
ThinkNow
 
Social Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie InsightsSocial Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie Insights
Kurio // The Social Media Age(ncy)
 

Destacado (20)

Product Design Trends in 2024 | Teenage Engineerings
Product Design Trends in 2024 | Teenage EngineeringsProduct Design Trends in 2024 | Teenage Engineerings
Product Design Trends in 2024 | Teenage Engineerings
 
How Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental HealthHow Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental Health
 
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
AI Trends in Creative Operations 2024 by Artwork Flow.pdfAI Trends in Creative Operations 2024 by Artwork Flow.pdf
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
 
Skeleton Culture Code
Skeleton Culture CodeSkeleton Culture Code
Skeleton Culture Code
 
PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024
 
Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)
 
How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024
 
Social Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie InsightsSocial Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie Insights
 
Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024
 
5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary
 
ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd
 
Getting into the tech field. what next
Getting into the tech field. what next Getting into the tech field. what next
Getting into the tech field. what next
 
Google's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search IntentGoogle's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search Intent
 
How to have difficult conversations
How to have difficult conversations How to have difficult conversations
How to have difficult conversations
 
Introduction to Data Science
Introduction to Data ScienceIntroduction to Data Science
Introduction to Data Science
 
Time Management & Productivity - Best Practices
Time Management & Productivity -  Best PracticesTime Management & Productivity -  Best Practices
Time Management & Productivity - Best Practices
 
The six step guide to practical project management
The six step guide to practical project managementThe six step guide to practical project management
The six step guide to practical project management
 
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
 
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
 
12 Ways to Increase Your Influence at Work
12 Ways to Increase Your Influence at Work12 Ways to Increase Your Influence at Work
12 Ways to Increase Your Influence at Work
 

JavaScript typeof and instanceof – the concept and differences

  • 1. JavaScript typeof and instanceof – the concept and differences For the actual blog post link visit : http://jbkflex.wordpress.com/2013/05/09/javascript-typeof-and- instanceof-the-concept-and-differences/ As a JavaScript developer you must have used the typeof and the instanceof operator sometime in your code to detect the the type of a variable in your program logic. And most often or not you might have been confused with the different results that show up while expecting a desired result. In this post I am gonna show you an easy technique to determine the type and instance of a variable. Let’s see some examples first. The typeof operator var str1 = "Hello, how are you?"; typeof str1; Output: "string" So, we have a string literal str1, and when we find the typeof str1, it gives “string”. Remember string is a primitive data type in JavaScript. Let’s see another example, var str2 = new String("I am doing good. Thank you!"); typeof str2; Output: "object" Now, we have a String Object and we have created an instance of that Object using the new operator, which is str2. Now if we do a typeof, it gives object. Remember that in JavaScript, other than the primitive data types (and null, undefined, function), everything else is an Object. So as expected you get the type as object. Now, let’s work with Array’s and try the same thing, var arr1 = [2,3,4]; //defining an array literal typeof arr1; Output: "object"
  • 2. var arr2 = new Array(4,5,6); //creating an Array Object instance typeof arr2; Output: "object" Firstly, we have an Array literal – arr1 and if we do a typeof it gives “object”. Why? Since Array’s are Objects and they are not part of the primitive data set. The next example is more obvious, we create an Array Object instance – arr2, and then do a typeof. As expected we get a “object”. So we have seen, if the typeof does not return a primitive data type (which are number, boolean, string), it will return an object. There are some special cases though, look at the bottom of this page to find out. The instanceof operator Now let’s take up some examples of the instanceof operator. var str1 = "Hello, how are you?"; //defining a string literal, same as above str1 instanceof String; Output: false If you see above, we have a string literal and when we do a instanceof to check if the variable is an instance of the String Object, it returns false. Since a string literal belongs to the string primitive data type. Now, consider the example below, var str2 = new String("I am doing good. Thank you!"); //defining a String object instance str2 instanceof String; Output: true Here, str2 is actually an instance, so the test returns true. But What’s up with the Array’s though? Let’s see, var arr1 = [2,3,4]; //defining an array literal arr1 instanceof Array; Output: true
  • 3. var arr2 = new Array(4,5,6); //creating an Array Object instance arr2 instanceof Array; Output: true Both returns true as both arr1 and arr2 are Array objects and they are not part of the primitve data set. In fact the following test also returns true arr1 instanceof Object; Output: true arr2 instanceof Object; Output: true This is because the Array object inherits from the more generic Object object. (Yes, you heard it right Object object!). Still confused about finding types and instances? Here is the rule to do it easily. Rule for the test So, how do you guess if a variable is an instance of its Object or Type. Here is the rule, 1) First check the type of the variable using typeof. 2) Now do the instanceof test. 3) a) If the typeof test returns a primitive type – number, boolean, string. Then instanceof test will return false. Because these are just primitive type data. They are not instances of any Object. b) But if typeof returns an object, then instanceof test will return true. So you know that you are dealing with objects and instances. For eg. var regexp = /d{3}/; //define a regular expression object typeof regexp; -> "object", not a primitive type
  • 4. regexp instanceof RegExp; -> true regexp instanceof Object; -> true Take another, var str = "Hello, me again!"; typeof str; -> "string" , a primitive type str instanceof String; -> false Now, you can think of some examples and put the rule to a test. Special cases 1) typeof null = “object” , since null is a special value in JavaScript which represents emptyness and it does not have any type. 2) typeof undefined = “undefined”, as expected 3) typeof NaN = number, since NaN is actually a special number, although it says Not a Number. Confusing? Just keep in mind. 4) typeof Function = “function” 5) typeof xmlObj = “xml” References 1) typeof operator : https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Operators/typeof 2) instanceof operator: https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Operators/instanceof