Tuesday, 3 December, 2019 UTC


Summary

If you are learning Javascript code, then you often face TypeError. Javascript TypeError object represents the error when the operation could not be performed, typically (but not exclusively) when the value is not of the expected type.
Javascript TypeError
JS TypeError may be thrown when the operand or argument passed to a function is incompatible with a type expected by that operator or function, or when attempting to modify the value that cannot be changed, or when attempting to misuse a value.

Syntax

new TypeError([message[, fileName[, lineNumber]]])
All the parameters are optional.
The message is a Human-readable description of the error.
The filename is the name of the file containing the code that caused the exception.
The lineNumber is the line number of the code that caused the exception.
See the following code example.
// app.js

let num = 11;
try {
  num.toUpperCase();
}
catch (err) {
  console.log(err)
}

Output

➜  es git:(master) ✗ node app
TypeError: num.toUpperCase is not a function
    at Object.<anonymous> (/Users/krunal/Desktop/code/node-examples/es/app.js:3:7)
    at Module._compile (internal/modules/cjs/loader.js:722:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:733:10)
    at Module.load (internal/modules/cjs/loader.js:620:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:560:12)
    at Function.Module._load (internal/modules/cjs/loader.js:552:3)
    at Function.Module.runMain (internal/modules/cjs/loader.js:775:12)
    at startup (internal/bootstrap/node.js:300:19)
    at bootstrapNodeJSCore (internal/bootstrap/node.js:826:3)
➜  es git:(master) ✗
We got the error like: TypeError: num.toUpperCase is not a function
In this example, we are trying to convert number to string, which is not possible, that is why catch the TypeError.
If you add 11 and H in JavaScript or when you try to perform operations on two operands of unmatched types, JavaScript throws a TypeError.
We can get the name of the error using error.name property. See the following code.
// app.js

let num = 11;
try {
  num.toUpperCase();
}
catch (err) {
  console.log(err.name)
}

Output

➜  es git:(master) ✗ node app
TypeError
➜  es git:(master) ✗
TypeError Methods
The global TypeError contains no functions of its own; however, it inherits some methods through a prototype chain.
TypeError Properties
There are the following properties of TypeError.

TypeError.prototype.constructor

It specifies a function that created the instance’s prototype.

TypeError.prototype.message

It gives the Error message. Although ECMA-262 specifies that TypeError should provide its message property, in
SpiderMonkey, it inherits Error.prototype.message.

TypeError.prototype.name

It gives the Error name. Inherited from Error.

TypeError.prototype.fileName

It gives the path to file that raised this error. Inherited from Error.

TypeError.prototype.lineNumber

It gives a line number in file that raised this error. Inherited from Error.

TypeError.prototype.columnNumber

It gives column numbers in line that raised this error. Inherited from Error.

TypeError.prototype.stack

It gives Stack trace. Inherited from Error.
Let’s see some of the properties in the code example.
// app.js

let num = 11;
try {
  num.toUpperCase();
}
catch (err) {
  console.log(err.message)
  console.log(err.stack)
  console.log(err.name)
}

Output

➜  es git:(master) ✗ node app.js
num.toUpperCase is not a function
TypeError: num.toUpperCase is not a function
    at Object.<anonymous> (/Users/krunal/Desktop/code/node-examples/es/app.js:3:7)
    at Module._compile (internal/modules/cjs/loader.js:722:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:733:10)
    at Module.load (internal/modules/cjs/loader.js:620:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:560:12)
    at Function.Module._load (internal/modules/cjs/loader.js:552:3)
    at Function.Module.runMain (internal/modules/cjs/loader.js:775:12)
    at startup (internal/bootstrap/node.js:300:19)
    at bootstrapNodeJSCore (internal/bootstrap/node.js:826:3)
TypeError
➜  es git:(master) ✗
Creating a TypeError
Now, one thing to remember that I am running this Javascript program on Node.js and not in the browser so, some of the property values might be undefined, but I guess in the browser, it works fine, I have not checked it but I am assuming here. You can check that as well.
// app.js

let num = 11;
try {
  throw new TypeError('Oops!! Error', "app.js", 10);
}
catch (err) {
  console.log(err instanceof TypeError);
  console.log(err.message);
  console.log(err.name);
  console.log(err.fileName);
  console.log(err.lineNumber);
  console.log(err.columnNumber);
  console.log(err.stack);
}

Output

➜  es git:(master) ✗ node app.js
true
Oops!! Error
TypeError
undefined
undefined
undefined
TypeError: Oops!! Error
    at Object.<anonymous> (/Users/krunal/Desktop/code/node-examples/es/app.js:3:9)
    at Module._compile (internal/modules/cjs/loader.js:722:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:733:10)
    at Module.load (internal/modules/cjs/loader.js:620:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:560:12)
    at Function.Module._load (internal/modules/cjs/loader.js:552:3)
    at Function.Module.runMain (internal/modules/cjs/loader.js:775:12)
    at startup (internal/bootstrap/node.js:300:19)
    at bootstrapNodeJSCore (internal/bootstrap/node.js:826:3)
➜  es git:(master) ✗
Solved: Uncaught Type Error: Cannot Set a Property
You can use the toString() function to convert a number into a string first, and then you can convert that string to upper case characters using the toUpperCase() function.
// app.js

let num = 11;
try {
  num.toString().toUpperCase();   
}
catch (err) {
  console.log(err.message);
}

Output

➜  es git:(master) ✗ node app.js
➜  es git:(master) ✗
It won’t give any error. It solved TypeError by converting the number to string.

TypeError Related to console.log()

We can often the following TypeErrors related to console.log in the browser.
TypeError: Property 'log' of object # is not a function (Chrome)
TypeError: console.log is not a function (Firefox) 
TypeError: 'your string' is not a function (evaluating 'console.log("your string")') (Safari)
TypeError: Function expected (IE)
Javascript TypeError is not a function
Let’s take a scenario where you have defined a variable, and then you call that variable as a function that causes this TypeError.
// app.js

let num = 11;

try {
  num();
}
catch (err) {
  console.log(err.message);
}

Output

➜  es git:(master) ✗ node app.js
num is not a function
➜  es git:(master) ✗
You can only call functions in JavaScript. You can call the Object properties.
TypeError: is not a constructor
Javascript built-in function objects that are not identified as constructors that do not implement the [[Construct]] internal method unless specified in the description of the specific function.
Finally, Javascript TypeError Example | Solve TypeError in Javascript is over.
The post Javascript TypeError Example | Solve TypeError in Javascript appeared first on AppDividend.