Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Why does `typeof this` return "object"?

var f = function(o){ return this+":"+o+"::"+(typeof this)+":"+(typeof o) };
f.call( "2", "2" );
// "2:2::object:string"

var f = function(o){ return this+":"+(typeof this)+":"+(typeof o); };
var x = [1,/foo/,"bar",function(){},true,[],{}];
for (var i=0;i<x.length;++i) console.log(f.call(x[i],x[i]));
// "1:object:number"
// "/foo/:object:object"
// "bar:object:string"
// "function () {\n}:function:function"
// "true:object:boolean"
// ":object:object"
// "[object Object]:object:object"

I see the same results in Chrome, Firefox, and Safari, so I assume it's per the spec, but...why? And where in the spec is this defined? And why not for functions?

like image 781
Phrogz Avatar asked Dec 08 '10 17:12

Phrogz


1 Answers

As defined in ECMA-262 ECMAScript Language Specification 3rd edition (see footnote), It's based on the spec (Section 15.3.4.4):

var result = fun.call(thisArg[, arg1[, arg2[, ...]]]);  

Parameters

thisArg

Determines the value of this inside fun. If thisArg is null or undefined, this will be the global object. Otherwise, this will be equal to Object(thisArg) (which is thisArg if thisArg is already an object, or a String, Boolean, or Number if thisArg is a primitive value of the corresponding type). Therefore, it is always true that typeof this == "object" when the function executes.

Note in particular the last line.

The crucial thing is that js primitives (string, number, boolean, null, undefined) are immutable, so a function can not be attached to them. Therefore the call function wraps the primitive in an Object so that the function can be attached.

E.g.:

Doesn't work:

var test = "string";
//the next 2 lines are invalid, as `test` is a primitive 
test.someFun = function () { alert(this); }; 
test.someFun();

Works:

var test = "string";
//wrap test up to give it a mutable wrapper
var temp = Object(test);
temp.someFun = function () { alert(this); };
temp.someFun();

(footnote) - as patrick dw noted in the comments, this will change in ECMA-262 ECMAScript Language Specification 5th edition when in strict mode:

From Section 15.3.4.4:

NOTE The thisArg value is passed without modification as the this value. This is a change from Edition 3, where a undefined or null thisArg is replaced with the global object and ToObject is applied to all other values and that result is passed as the this value.

like image 136
jball Avatar answered Sep 19 '22 11:09

jball