Last updated: Feb 27, 2024
Reading time·3 min

The "Unexpected token. A constructor, method, accessor, or property was
expected" error occurs when we use the var or let keywords to declare a
class property or the function keyword in a class.
To solve the error, remove the var, let and function keywords from your
class.
Here are 2 examples of how the error occurs.
class A { // ⛔️ Error (using var, let) var a: number = 100; let b: string = 'hello'; // ⛔️ Error: Unexpected token. A constructor, // method, accessor, or property was expected.ts(1068) function myFunction() { } }

We used the var and let keywords to assign properties to the class and the
function keyword to declare class method.
To resolve the issue, remove the var, let and function keywords from your
class.
class A { a = 100; b = 'bobbyhadz.com'; myFunction() { console.log(this.a); } } const myInstance = new A(); console.log(myInstance.a); // 👉️ 100 console.log(myInstance.b); // 👉️ "bobbyhadz.com" myInstance.myFunction(); // 👉️ 100

The class has 2
propertied - a and b and a method named myFunction.
You will often have to take arguments when creating class instances. You can do that via the constructor method.
class A { constructor( public a: number, public b: string, ) { this.a = a; this.b = b; } myFunction() { console.log(this.a); } } const myInstance = new A(42, 'bobbyhadz.com'); console.log(myInstance.a); // 👉️ 42 console.log(myInstance.b); // 👉️ "bobbyhadz.com"

Notice that we assigned the a and b properties inside the constructor method
and we aren't using the var, let or function keywords anywhere inside the
class.
The class in the example is a more concise version of the following class.
class A { a: number; b: string; constructor(a: number, b: string) { this.a = a; this.b = b; } myFunction() { console.log(this.a); } } const myInstance = new A(42, 'bobbyhadz.com'); console.log(myInstance.a); // 👉️ 42 console.log(myInstance.b); // 👉️ "bobbyhadz.com"
We had to type the a and b class properties twice to achieve the same
result.
public keyword in the constructor is more widely used.You can also use default values for constructor parameters.
class A { constructor( public a = 100, public b = 'bobbyhadz.com', ) { this.a = a; this.b = b; } myFunction() { console.log(this.a); } } const myInstance = new A(); console.log(myInstance.a); // 👉️ 100 console.log(myInstance.b); // 👉️ "bobbyhadz.com"

We created an instance of the class without passing any parameters to the
constructor function, so the a and b properties are set to the default
values.
You can also use arrow functions for class methods.
class A { constructor( public a = 100, public b = 'bobbyhadz.com', ) { this.a = a; this.b = b; } myFunction = () => { console.log(this.a); }; } const myInstance = new A(); console.log(myInstance.a); // 👉️ 100 console.log(myInstance.b); // 👉️ "bobbyhadz.com" myInstance.myFunction(); // 👉️ 100
Notice that we aren't using the const, let or var keywords in the method's
definition.
You can learn more about the related topics by checking out the following tutorials: