{"id":687,"date":"2011-08-14T20:49:56","date_gmt":"2011-08-14T18:49:56","guid":{"rendered":"http:\/\/blog.kodono.info\/wordpress\/?p=687"},"modified":"2011-08-14T20:49:56","modified_gmt":"2011-08-14T18:49:56","slug":"loperateur-typeof-en-javascript-programmation","status":"publish","type":"post","link":"https:\/\/blog.kodono.info\/wordpress\/2011\/08\/14\/loperateur-typeof-en-javascript-programmation\/","title":{"rendered":"L’op\u00e9rateur typeof en Javascript [programmation]"},"content":{"rendered":"

Si vous avez d\u00e9j\u00e0 essay\u00e9 d’utiliser typeof<\/code> en Javascript pour trouver le type d’un objet, vous avez d\u00fb vous rendre compte que cet op\u00e9rateur n’aide pas beaucoup….<\/p>\n

Le typeof par d\u00e9faut de Javascript<\/h1>\n

D\u00e9j\u00e0, comme typeof<\/code> est un op\u00e9rateur, vous n’avez pas besoin d’utiliser des parenth\u00e8ses ou une quelconque autre d\u00e9coration.
\nAinsi on aura :<\/p>\n

typeof 2; \/\/ -> \"number\"\r\ntypeof \"Kodono\"; \/\/ -> \"string\"<\/pre>\n
On peut remarquer qu’ici typeof<\/code> nous a bien donn\u00e9 ce qu’on attendait… mais voil\u00e0 ce qu’il se passe avec d’autres exemples :<\/p>\n
typeof []; \/\/ -> \"object\"\r\ntypeof new Boolean(true); \/\/ -> \"object\"\r\ntypeof \/a\/; \/\/ -> \"object\"\r\ntypeof new Date(); \/\/ -> \"object\"\r\ntypeof null; \/\/ -> \"object\"<\/pre>\n
Comme on peut le voir, l’op\u00e9rateur va fournir un “object” dans de nombreuses situations, ce qui n’aide pas du tout.<\/p>\n
Cr\u00e9er un meilleur typeof<\/h1>\n
Pour faire court, on peut appliquer Object.prototype.toString.call<\/code> \u00e0 un objet qui va retourner une chaine au format “[object Class<\/i>]”. Quelques exemples :<\/p>\n
Object.prototype.toString.call(new Number(2)); \/\/ -> [object Number]\r\nObject.prototype.toString.call(new Date()); \/\/ -> [object Date]\r\nObject.prototype.toString.call(\/a\/); \/\/ -> [object RegExp]<\/pre>\n
Maintenant que l’on sait \u00e7a on peut cr\u00e9er notre propose fonction typeOf<\/code> (en sachant que Object.prototype<\/code> peut se raccourcir par ({})\/<\/code>).
\nOn trouve sur Internet diff\u00e9rentes fa\u00e7ons de faire que je vais vous proposer.<\/p>\n
La plus lente<\/h2>\n
Elle n’est pas tr\u00e8s rapide (d\u00fbe \u00e0 l’utilisation des expressions r\u00e9guli\u00e8res), mais elle est tr\u00e8s courte :<\/p>\n
function typeOf(obj){return({}).toString.call(obj).match(\/\\s(\\w+)\/)[1]}\r\n\r\nconsole.log(typeOf(new Number(2))); \/\/ -> Number\r\nconsole.log(typeOf(new Date())); \/\/ -> Date\r\nconsole.log(typeOf(\"test\")); \/\/ -> String\r\nconsole.log(typeOf(null)); \/\/ -> Null\r\nconsole.log(typeOf(\/a\/)); \/\/ -> RegExp\r\nconsole.log(typeOf([])); \/\/ -> Array\r\nconsole.log(typeOf(function(){})); \/\/ -> Function<\/pre>\n
jQuery.type<\/h2>\n
Si vous utilisez d\u00e9j\u00e0 jQuery<\/em>, vous pouvez utiliser la fonction jQuery.type<\/a> qui propose une fonction assez rapide et efficace.
\nIls utilisent la m\u00e9thode suivante :<\/p>\n
\r\nfunction typeOf(obj){\r\n  var c2t={\"[object Boolean]\":\"Boolean\",\"[object Number]\":\"Number\",\"[object String]\":\"String\",\"[object Function]\":\"Function\",\"[object Array]\":\"Array\",\"[object Date]\":\"Date\",\"[object RegExp]\":\"RegExp\",\"[object Object]\":\"Object\"};\r\n  return obj==null?String(obj):c2t[({}).toString.call(obj)]||\"object\";\r\n}\r\n\r\nconsole.log(typeOf(new Number(2))); \/\/ -> Number\r\nconsole.log(typeOf(new Date())); \/\/ -> Date\r\nconsole.log(typeOf(\"test\")); \/\/ -> String\r\nconsole.log(typeOf(null)); \/\/ -> Null\r\nconsole.log(typeOf(\/a\/)); \/\/ -> RegExp\r\nconsole.log(typeOf([])); \/\/ -> Array\r\nconsole.log(typeOf(function(){})); \/\/ -> Function<\/pre>\n
La plus courte et rapide<\/h2>\n
Celle-ci ne prend que quelques caract\u00e8res, et se veut rapide en plus<\/a> !<\/p>\n
function typeOf(obj) {return({}).toString.call(obj).slice(8,-1)}\r\n\r\nconsole.log(typeOf(new Number(2))); \/\/ -> Number\r\nconsole.log(typeOf(new Date())); \/\/ -> Date\r\nconsole.log(typeOf(\"test\")); \/\/ -> String\r\nconsole.log(typeOf(null)); \/\/ -> Null\r\nconsole.log(typeOf(\/a\/)); \/\/ -> RegExp\r\nconsole.log(typeOf([])); \/\/ -> Array\r\nconsole.log(typeOf(function(){})); \/\/ -> Function<\/pre>\n
Conclusion<\/h2>\n
Si vous utilisez d\u00e9j\u00e0 jQuery dans votre code, alors vous pouvez faire confiance \u00e0 jQuery.type<\/code>, sinon je vous conseille la derni\u00e8re fonction propos\u00e9e :<\/p>\n
function typeOf(obj) {return({}).toString.call(obj).slice(8,-1)}<\/pre>\n","protected":false},"excerpt":{"rendered":"
Si vous avez d\u00e9j\u00e0 essay\u00e9 d’utiliser typeof en Javascript pour trouver le type d’un objet, vous avez d\u00fb vous rendre compte que cet op\u00e9rateur n’aide pas beaucoup…. Le typeof par d\u00e9faut de Javascript D\u00e9j\u00e0, comme typeof est un op\u00e9rateur, vous n’avez pas besoin d’utiliser des parenth\u00e8ses ou une quelconque autre d\u00e9coration. Ainsi on aura : […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_coblocks_attr":"","_coblocks_dimensions":"","_coblocks_responsive_height":"","_coblocks_accordion_ie_support":"","hide_page_title":"","footnotes":""},"categories":[11,33],"tags":[24,111,164,158],"class_list":["post-687","post","type-post","status-publish","format-standard","hentry","category-niveau-debutant","category-programmation","tag-javascript","tag-jquery","tag-performance","tag-programmation"],"_links":{"self":[{"href":"https:\/\/blog.kodono.info\/wordpress\/wp-json\/wp\/v2\/posts\/687","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.kodono.info\/wordpress\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.kodono.info\/wordpress\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.kodono.info\/wordpress\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.kodono.info\/wordpress\/wp-json\/wp\/v2\/comments?post=687"}],"version-history":[{"count":12,"href":"https:\/\/blog.kodono.info\/wordpress\/wp-json\/wp\/v2\/posts\/687\/revisions"}],"predecessor-version":[{"id":699,"href":"https:\/\/blog.kodono.info\/wordpress\/wp-json\/wp\/v2\/posts\/687\/revisions\/699"}],"wp:attachment":[{"href":"https:\/\/blog.kodono.info\/wordpress\/wp-json\/wp\/v2\/media?parent=687"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.kodono.info\/wordpress\/wp-json\/wp\/v2\/categories?post=687"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.kodono.info\/wordpress\/wp-json\/wp\/v2\/tags?post=687"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}