Javascript.RU

typeof

Описание, примеры

Вызов typeof возвращает строку, содержащую информацию о типе операнда.

Оператор typeof используется в двух формах:

  1. typeof operand
  2. typeof (operand)

Эти формы идентичны: можно использовать скобки, а можно и не использовать - работает одинаково.

Оператор возвращает тип в виде строки, например:

var a = 5
alert(typeof a) // "number"

var a = 'test'
alert(typeof a) // "string"

Тип typeof возвращается, исходя из следующей таблицы соответствия типам javascript:

Тип Результат
Undefined "undefined"
Null "object"
Boolean "boolean"
Number "number"
String "string"
Function "function"
Любой другой объект "object"

Часто возникают вопросы - почему и зачем таблица именно такая? Ответ простой: потому что так получилось по ходу развития javascript.

В старом javascript-коде можно увидеть применение typeof для проверки существования переменной:

if (typeof(var) == "undefined") { ... }

В современном javascript лучше писать:

if (window.var !== undefined) { ... }

или, зачастую, подойдет и просто:

if (window.var) { ... }

P.S. Использовать просто if(var) нельзя, так как доступ к неопределенной переменной вызовет ошибку. Ну а обращение к отсутствующему свойству глобального объекта window всего лишь вернет undefined

Кроме того, оператор typeof используется для полиморфизма. Например, следующая функция получает узел DOM или ID узла и в обоих случаях корректно прячет узел.

function hideNode(node) {
  if (typeof node == 'string') {
    node = document.getElementById(node)
  }
  node.style.display = 'none'
}

См. также


Автор: Vladimir_O, дата: 27 ноября, 2009 - 16:09
#permalink

>>можно писать:

if (window.var !== undefined) { ... }

Думаю что так писать не стоит. Вот пример, когда этот метод не сработает:

undefined = 1; // Вот взяли и определили переменную, 
//... и она теперь совсем не 'undefined'
if (window.var !== undefined) { ... }

Автор: Илья Кантор, дата: 28 ноября, 2009 - 07:57
#permalink

Никто в здравом уме не будет переопределять undefined во что-либо другое.


Автор: Vladimir_O, дата: 11 декабря, 2009 - 17:33
#permalink

Думаю что на здравый ум полагаться не стоит, а потому, надежной проверкой будет проверка при помощи typeof.


Автор: Илья Кантор, дата: 12 декабря, 2009 - 11:54
#permalink

Забавный комментарий. На чей здравый ум не стоит полагаться? На свой или на чужой?


Автор: Vladimir_O, дата: 16 декабря, 2009 - 18:07
#permalink

Конечно же на чужой . Ведь в большинстве случаев я использую сторонние библиотеки.


Автор: Гость (не зарегистрирован), дата: 22 ноября, 2011 - 16:00
#permalink

if (window.var !== undefined) { ... }

без объявленной переменной undefined вы сравниваете одну несуществующую переменной с другой;) сравнивать нужно со строкой "undefined" (в кавычках!!!), так что проблемы с объявлением переменной undefined никакой нет!!!


Автор: Гость (не зарегистрирован), дата: 7 декабря, 2009 - 19:49
#permalink

Как то вы объясняете плохо. Пока в другом месте не нашел непонятно.
Операция typeof возвращает строку, содержащую информацию о типе операнда. Она имеет вид:
typeof expr или typeof(expr)

где expr — любое выражение. Возвращаемое значение может быть одной из шести строк: "number" (число), "string" (строка), "boolean" (логическое значение), "object" (объект), "function" (функция) или "undefined" (неопределенное значение). Примеры:
var size = 1;
var shape = "круглый";
var today = new Date();
typeof(size); // возвращает "number"
typeof shape; // возвращает "string"
typeof today; // возвращает "object"


Автор: Dmitry A. Soshnikov, дата: 13 декабря, 2009 - 12:40
#permalink

В современном javascript оператор typeof практически не используется. Например, вместо проверки:

if (typeof(var) == "undefined") { ... }

можно писать:

if (window.var !== undefined) { ... }

или, зачастую, подойдет и просто:

if (window.var) { ... }

Вообще, по смысловой нагрузке, проверка существования переменной в объекте переменных, либо, что эта переменная имеет значение undefined, может быть осуществлена либо через:

typeof foo == 'undefined';

либо (в глобальной области) с помощью оператора in:

'foo' in window

Опять же, проверка с typeof позволяет проверить наличие переменной и во вложенном контексте (например, в функции), чего нельзя сделать при помощи window.var или window.var !== undefined. Более того, в предпоследнем случае, объект может иметь значение false, что полностью меняет смысл проверки.

Поэтому, typeof вполне себе используется в современном ES.


Автор: Илья Кантор, дата: 13 декабря, 2009 - 14:10
#permalink

Теоретически да, typeof может проверить наличие переменной в текущем контексте.
Однако, в реальных приложениях на современном(да и на несовременном тоже) javascript этого не нужно.
Локальная переменная, объявленная при помощи var, не нуждается в typeof: достаточно простого if (myVar !== undefined).

Поэтому для проверки на undefined оператор typeof в современном javascript не используется.


Автор: Glaz (не зарегистрирован), дата: 29 марта, 2010 - 18:23
#permalink

Т.е. предлагаете делать две проверки на существование переменной в контекстах?

if (myVar !== undefined && window.myVar)

Автор: Shock, дата: 8 марта, 2011 - 12:59
#permalink

А вы не знаете, что творится в локальном контексте вашей функции? Если у вас есть переменная в локальном контексте - проверяйте её без typeof, если нету, то зачем её вообще проверять?


Автор: Гость (не зарегистрирован), дата: 13 июня, 2015 - 12:28
#permalink
function name(name) {
	if('string'===typeof name && name || 'object'===typeof name && Object.keys(name).length) {
		//...
	}
}

Автор: agentcoba (не зарегистрирован), дата: 2 января, 2010 - 22:57
#permalink

А если я хочу проверить является ли переменная именно целым числом, то никак?? что мне, циклом разбивать его и проверять каждый символ? //


Автор: B@rmaley.e><e (не зарегистрирован), дата: 3 января, 2010 - 10:03
#permalink
var num = 5;
alert( num % 1 == 0 )

Автор: eZH! (не зарегистрирован), дата: 1 февраля, 2010 - 12:23
#permalink

остаток от деления на 1 всегда 0, делить нада на 2


Автор: B@rmaley.e><e, дата: 1 февраля, 2010 - 15:03
#permalink

Давычо?!

alert( 5.1 % 1 )

Мы проверяем не на четность / нечетность, а на целость / дробность.


Автор: Arm (не зарегистрирован), дата: 21 мая, 2010 - 08:55
#permalink

комментаторов выше в топку.
type==undefined работает далеко не всегда, особенно в ИЕ.
не приходилось видеть сообщение undefined is undefined? ))
приходится использовать конструкцию
if (typeof myvar == 'undefined' || typeof myvar=='null' || typeof myvar=='unknown') {


Автор: bdiang, дата: 24 мая, 2010 - 12:42
#permalink

Что еще за typeof myvar=='null'?


Автор: Increazon, дата: 30 декабря, 2010 - 07:09
#permalink

Проверил, в ИЕ работает.

function Log(what)
{
	if (typeof(console) == "object") console.log(what);
}

function Dir(what)
{
	if (typeof(console) == "object") console.dir(what);
}

Это для отладки в Firefox Firebug. После отладки функции можно не закоментирововать и не удалять. Можна готовую работу заказщику отправлять.


Автор: Shock, дата: 8 марта, 2011 - 13:04
#permalink

Лучше так

new function () {
  var debug    = true;
  var original = window.console;
  window.console = {};
  ['log', 'dir', /* остальные методы */].forEach(function (method) {
    console[method] = function () {
      return (debug && original) ? original[method].apply(original, arguments), 
    }
  });
};

Автор: _JoHn_ (не зарегистрирован), дата: 15 февраля, 2011 - 01:28
#permalink

Number.MIN_VALUE > 0; // true or false?

typeof null; // what type?
null === Object; // true or false?

// и самый сок

NaN === NaN; // true or false?

typeof NaN; // what type?


Автор: _JoHn_ (не зарегистрирован), дата: 15 февраля, 2011 - 01:30
#permalink

Number.MIN_VALUE > 0; // true
/*
Дело в том, что MIN_VALUE это наименьшее число, БОЛЬШЕ НУЛЯ
*/

typeof null; // object
null === Object; // false
/*
null, хоть и имеет тип "object", не является Object'ом
*/

NaN === NaN; // false
/*
Впечатляет, да? Я не могу найти этому объяснения. Автор же просто предполагает, что некоторые люди любят иногда понюхать клей...
*/

typeof NaN; // number
/*
Вот это сильно. Если вдруг кто не помнит, NaN — not a number.
*/


Автор: Гость (не зарегистрирован), дата: 5 апреля, 2011 - 14:18
#permalink

NaN === NaN; // false
Логически всё верно. NotaNumber1 = object1. NotaNumber2 = object2. object1 != object2. следовательно, NaN != NaN ни при каких обстоятельствах.


Автор: И.В.Ануш-ка (не зарегистрирован), дата: 7 декабря, 2011 - 20:12
#permalink

typeof null; // object
null === Object; // false
/*
null, хоть и имеет тип "object", не является Object'ом
*/

В том, что ключевое слово null не равняется ссылке на конструктор объекта, есть что-то неожиданное или неправильное?
'blabla' === String тоже вернет false, и что?


Автор: Гость (не зарегистрирован), дата: 28 января, 2013 - 18:37
#permalink

Number.MIN_VALUE > 0; // true
/*
Хотя бы попробовал вывести это число сначала. Это наименьшее число, в смысле по модулю, оно хоть и очень маленькое, но всё же больше нуля.
*/

NaN === NaN; // false
/*
А по твоему должно быть иначе:
Math.sqrt(-1) === (+"Not a Number"); //true или false? я думаю false
*/

typeof NaN; // number
/*
NaN - это специфичное значение Number, посмотри напр в википедии.
Используется вместо генерации исключения, когда значение не удаётся посчитать, напр Math.sqrt(-1), 0/0. Есть и другие специфичные значения у Number, например Infinity. И это логично: что мы получим разделив число на число, пожалуй, число, а число на число 0 - тоже число, только это число Infinity (бесконечность) (но 0/0 == NaN), можно взять арктангенc Infinity и будет 90 град.
*/


Автор: xpostman (не зарегистрирован), дата: 18 апреля, 2011 - 19:15
#permalink
if( var )

опасный способ. всё время нужно думать о том, что var может быть определена, но кастоваться в false. имхо, это стоит добавить в статью.


Автор: Наше имя (не зарегистрирован), дата: 15 декабря, 2011 - 18:38
#permalink
if ( !! var )

Автор: Гость (не зарегистрирован), дата: 5 июня, 2012 - 16:16
#permalink

вы хоть бы проверили в консоле...


Автор: Гость (не зарегистрирован), дата: 24 июня, 2012 - 15:52
#permalink

а мне прикольно typeof() использовать


Автор: Dzmitry Vl.Bondar (не зарегистрирован), дата: 13 июля, 2012 - 15:40
#permalink

По поводу typeOf: весьма полезная штука, спасала не раз и не два.
Особенно в случаях когда используешь сторонние JS модули, написанные любителями быстрых но недальновидных решений. Типа этого:
...
Array.prototype.indexOfObjWithItem = function (name, item, fromIndex) {
if (fromIndex == null) {
fromIndex = 0;
} else if (fromIndex < 0) {
fromIndex = Math.max(0, this.length + fromIndex);
}
for (var i = fromIndex, j = this.length; i < j; i++) {
if (this[i][name] === item) return i;
}
return -1;
};
...
После чего предлагаю подумать что произойдет в цикле ниже:
var arr = [], str = "";
arr.a = { val: function () { return 1 } }
arr.b = { val: function () { return 2 } }
for (item in arr) {
str += arr[item].val() + ",";
}
лечится например так:
if (typeof item == "function") continue;


Автор: Vitaly Sharovatov, дата: 4 октября, 2012 - 17:29
#permalink

а что, если Global - не window, как, например, в node.js или любой другой не-браузерной среде? В таком случае typeof someVar != 'undefined' будет работать, а someVar != undefined выкинет ReferenceError

Итого, typeof someVar != 'undefined' просто безопаснее и "кроссплатформеннее", т.к. typeof не пытается брать значения операнда, а сразу возвращает "undefined", если свойство с таким именем не найдено. См. production:

------------
if Type(val) is Reference, then
If IsUnresolvableReference(val) is true, return "undefined".
------------


Автор: N. (не зарегистрирован), дата: 19 октября, 2012 - 03:44
#permalink

На сайте youtube.com код

var yt = yt || {}

вызывается в глобальной области видимости. Почему это работает (если это работает)? yt проверяется без window и код на этом должен прекратить выполняться.

И для чего используется

(function ()   {
    var swf = '...';
    document.getElementById('watch-player').innerHTML = swf;
}) ()

вместо

document.getElementById('watch-player').innerHTML = '...'

?


Автор: Cryvage, дата: 1 ноября, 2012 - 08:32
#permalink

По поводу var yt = yt || {}. Дело в том, что JavaScript очень коварный язык. Он лишь кажется простым. На деле же он является одним из самых сложных для понимания. В данном случае код работает из-за особенности обработки директивы var. Все директивы var обрабатываются на входе в процедуру, не зависимо от того в каком месте этой процедуры они написаны. Иными словами

var yt = yt || {}

Эквивалентно

var yt;
 yt = yt || {};

Получается yt как бы была объявлена до этой проверки. Потому и нет ошибки. Хотя я бы не стал так делать, ибо не наглядно и может стать причиной косяков.
Более того, у этой особенности языка есть неприятные подводные камни. Так, если вверху процедуры вы попытаетесь использовать глобальную переменную

x=5;

а потом внизу этой же процедуры объявите локальную переменную

var x;

То получится что пятерку вы ранее присваивали локальной переменной, а не глобальной. Глобальная же переменная при этом становится недоступна в пределах всей процедуры. Потому что, например:

x=5;
 var x=6;

Это На самом деле:

var x;
 x=5;
 x=6;

При желании вы вообще можете объявить все локальные переменные в самом низу, при этом они будут доступны, так словно вы объявили их вверху. Это ни в коем случае не стоит расценивать как рекомендацию. Наоборот, я бы рекомендовал, подобного всячески избегать.
Ну и напоследок комплексный пример:

var a = 3;//глобальная переменная
function testVar(){
 a=4;//изменяется локальная переменная, объявленная ниже
 var a = 6;//все та же локальная переменная, что и выше
}
alert(a);//по прежнему равно 3, а не 4

Ну а что касается swf, то предположу что автору этого кода просто нравится писать в таком стиле. Кроме того, обычно использовать прямое присвоение полям класса какого-либо числового или строкового значения считается плохим тоном. Такие числа и строки называют "магическими", потому что из контекста программы может быть не очевидно, что они значат, и почему они именно такие. Вместо них, как правило, используются именованные константы. Но в JavaScript нету констант. Поэтому приходится использовать переменные. Так, вместо того, чтобы присвоить innerHTML три точки, здесь этим трем точкам дано имя swf, что как бы подразумевает что в этом месте должен располагаться флеш объект. Это, пусть и не очень емкая, но хоть какая-то подсказка. Так в коде проще разобраться. А если одно и то же значение в коде используется несколько раз, то тогда уж тем более лучше его переменной присвоить. В случае с JavaScript, есть и еще одна причина. К JS коду часто применяют минификацию, чтобы сделать код компактней. При этом минификатор работает по определенному алгоритму, и часто код пишется так, чтобы минификатор его наиболее оптимально обработал. Если написать код, в котором неоднократно используется одно и то же значение, то минификатор никак не сможет его сжать, а если присвоить это значение переменной, и потом использовать ее, то даже если имя переменной длинное и информативное, минификатор может просто изменить его на одну букву, если эта переменная локальная. В связи со всем этим, и может чем-то еще, во многих программистских коллективах существуют соглашения по написанию кода, часто они есть не только на словах, но даже в виде документа. Это особенно важно при совместной работе над одним проектом нескольких человек. Данный, на вид избыточный код может быть следствием такого соглашения.
В данном случае этот код может казаться избыточным, но во-первых если уж разработчик придерживается определенного стиля или тем более соглашения, то лучше придерживаться его во всем, даже когда это кажется излишним, во-вторых любая функция в дальнейшем может быть модифицирована, дополнена, и лучше изначально писать код с запасом на будущее.


Автор: Гость (не зарегистрирован), дата: 8 июля, 2013 - 08:48
#permalink

Cryvage, а запускать-то функцию кто будет?


Автор: Kella (не зарегистрирован), дата: 22 ноября, 2013 - 00:12
#permalink

Объясните пожалуйста, кто-нибудь, как может typeof == 'source' ?

function cloneObject(source) {
    for (i in source) {
        if (typeof source[i] == 'source') {
            this[i] = new cloneObject(source[i]);
        }
        else{
            this[i] = source[i];
        }
    }
}
 
var obj1= {bla:'blabla',foo:'foofoo',etc:'etc'};
 
var obj2= new cloneObject(obj1);

Это рабочая, рекурсивная функция для клонирования объектов, но не понимаю, откуда 'source', даже учитывая == вместо ===


Автор: Гость (не зарегистрирован), дата: 10 декабря, 2013 - 20:55
#permalink

А эта функция и не работает. Попробуйте выполнить вот этот код:

function cloneObject(source) {
    for (i in source) {
        if (typeof source[i] == 'source') {
            this[i] = new cloneObject(source[i]);
        }
        else{
            this[i] = source[i];
        }
    }
}

var obj1 = { obj: { key: 1, value: 2 }, field1: "f1", field2: "f2" };
var obj2 = new cloneObject(obj1);

obj1.obj.key = 2;

alert(obj1.obj.key === obj2.obj.key);

Из него можно понять, что внутненний объект не клонируется. А проблема, видимо, в том, что агрумент функции был переименован из object в source, что повело за собой и замену строки "object" на "source".

Таким образом правильный вариант такой:

function cloneObject(source) {
    for (var i in source) {
        if (typeof source[i] == 'object') {
            this[i] = new cloneObject(source[i]);
        }
        else{
            this[i] = source[i];
        }
    }
}

Автор: Гость (не зарегистрирован), дата: 8 января, 2014 - 12:27
#permalink

Как-то Вы странно объясняете ...

"typeof source[i] == 'object'" - это и ежу понятно что нет такого типа как "source", тогда зачем парить народ, приводя в начале нерабочий вариант, а потом раскрывать суть?
Может стоит сразу писать правильно, но тогда пропадает сама "суть" и мы приходим к выводу, что так делать не стоит.


Автор: Гость (не зарегистрирован), дата: 8 января, 2014 - 12:37
#permalink

Чет я с просони неправильно понял и потерялся в дискуссии. Так что извиняюсь.

В общем, претензии отзываются, но все просто как я и говорил выше - нет такого типа как "source" и все правильно - имелся ввиду "object", но все-равно непонятно - какого черта там "source"?!


Автор: memelay1 (не зарегистрирован), дата: 15 июля, 2014 - 22:25
#permalink

А как проверить на существование такого объекта:
config.showcase.timer

Следующая запись вызывает ошибку:
if(window.config.showcase.timer === undefined)


Автор: nightkon, дата: 13 июня, 2015 - 15:27
#permalink

В таком случае употребление typeof не поможет, выдаст такую же ошибку, по причине того, что config не был определён.

Убеждаемся в этом:

typeof config.showcase.timer // Error: config is not defined


Правильный код (как я считаю):

window.config && config.showcase.timer // undefined

Смысл этого кода в том, что нужно проверить существует ли основной (родительский объект), а потом проверять вложенные свойства.

Ведь, всё это нужно, чтобы наш код не вернул ошибку. Этот код и обходит эту ошибку.

Если свойство определено, то всё будет отлично, пример:

var config = {showcase: {timer: true}};
window.config && config.showcase.timer // true

Автор: Гость (не зарегистрирован), дата: 6 июля, 2019 - 09:40
#permalink
alert(typeof NaN)
// output number

Почему ответ - number?


Автор: Гость (не зарегистрирован), дата: 28 марта, 2022 - 14:45
#permalink

Оператор typeof используется в двух формах: Fireboy and Watergirl


Автор: Гость (не зарегистрирован), дата: 27 сентября, 2023 - 06:38
#permalink

retro bowl college campus setting adds an extra layer of nostalgia to the game. Immerse yourself in the atmosphere of college football, from the field to the locker room.


Автор: Гость (не зарегистрирован), дата: 23 ноября, 2023 - 06:46
#permalink

I want to express my subway surfers gratitude for providing readers with a truly one-of-a-kind article.


Автор: lalisa167 (не зарегистрирован), дата: 22 января, 2024 - 05:37
#permalink

Thank you for hosting the most exceptional blog. I found it quite advantageous.Please continue to disseminate similar concepts in the future. I appreciate your provision of valuable information. I require it. papa's freezeria


Автор: adele (не зарегистрирован), дата: 18 марта, 2024 - 10:37
#permalink

I appreciate the attention to detail in the design of Papa's Games.


Отправить комментарий

Приветствуются комментарии:
  • Полезные.
  • Дополняющие прочитанное.
  • Вопросы по прочитанному. Именно по прочитанному, чтобы ответ на него помог другим разобраться в предмете статьи. Другие вопросы могут быть удалены.
    Для остальных вопросов и обсуждений есть форум.
P.S. Лучшее "спасибо" - не комментарий, как все здорово, а рекомендация или ссылка на статью.
Содержание этого поля является приватным и не предназначено к показу.
  • Адреса страниц и электронной почты автоматически преобразуются в ссылки.
  • Разрешены HTML-таги: <strike> <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <u> <i> <b> <pre> <img> <abbr> <blockquote> <h1> <h2> <h3> <h4> <h5> <p> <div> <span> <sub> <sup>
  • Строки и параграфы переносятся автоматически.
  • Текстовые смайлы будут заменены на графические.

Подробнее о форматировании

CAPTCHA
Антиспам
13 + 3 =
Введите результат. Например, для 1+3, введите 4.
 
Поиск по сайту
Содержание

Учебник javascript

Основные элементы языка

Сундучок с инструментами

Интерфейсы

Все об AJAX

Оптимизация

Разное

Дерево всех статей

Последние комментарии
Последние темы на форуме
Forum