CODEWITHSUNDEEP
javascript
Srinivas Yvs
Srinivas Yvs

Reputation: 41

Array.length is a property not a method, but how .length is work like a method?

A method can get a value from an Array with the logic of that method. but length is not a method to an array, though returning a value when we write array.length, How?

"How did I get to know that .length is property to an array? is 'We all know that a method should have () when we are invoking a method, but .length don't invoke with (). so it is property to an object'".

var arr = [1,2,3,8,6,4,9,5,8,6];
console.log(arr.length); //10 - 
console.log(Math.max(...arr)); //9

max() is returning a value because it is methode

As a property how does .length return a value?

Upvotes: 3

Views: 1389

Answers (4)

M M
M M

Reputation: 725

Good Question. The only catch here is that you believe Array.length is calculated when you invoke/call this property. No, it does not happen like that.

When an Array is created, it's properties get set. These properties like length, prototypical functions etc. contain a value when an Array is created. When you execute Array.length, you are only getting the value of that property. In case of functions, the code execution happens when you invoke the call.

Think of it like a constructor in the Array definition which sets the property length as soon as an object of Array class is created and modified.

Upvotes: 3

Charlie
Charlie

Reputation: 23778

The length property of an object which is an instance of type Array sets or returns the number of elements in that array. The value is an unsigned, 32-bit integer that is always numerically greater than the highest index in the array.

As stated, you can also use it to set the number of elements. This is achievable using a getter and setter by theory.

The following example sets the latest property of an object which will represent the last element of an internal array. 

var obj = {
  log: ['a', 'b', 'c'],
  get latest() {
    if (this.log.length == 0) {
      return undefined;
    }
    return this.log[this.log.length - 1];
  },

  set latest(val) {
    this.log[this.log.length - 1] = val;
  }
}

obj.latest = 'z';
console.log(obj.latest);

Upvotes: 1

Nina Scholz
Nina Scholz

Reputation: 386578

You could take a property and assign or get a value from it, but it is iomplementes as setter and getter. This allows to use a function as simple property and uses the assigned value for changing other things, like to remove items.

var object = {
    l: 42,
    get length() { return this.l; },
    set length(l) { this.l = l; },
}

console.log(object.length);
object.length = 2;
console.log(object.length);

Upvotes: 4

CertainPerformance
CertainPerformance

Reputation: 370729

Arrays are officially called "Array exotic objects". This sort of very weird behavior you're seeing, where an object property apparently changes itself automatically, is not visible (or possible to implement) on ordinary Javascript objects:

This specification defines several kinds of built-in exotic objects. These objects generally behave similar to ordinary objects except for a few specific situations. The following exotic objects use the ordinary object internal methods except where it is explicitly specified otherwise below:

and

An Array object is an exotic object that gives special treatment to array index property keys (see 6.1.7). A property whose property name is an array index is also called an element. Every Array object has a length property whose value is always a nonnegative integer less than 232. The value of the length property is numerically greater than the name of every own property whose name is an array index; whenever an own property of an Array object is created or changed, other properties are adjusted as necessary to maintain this invariant. Specifically, whenever an own property is added whose name is an array index, the value of the length property is changed, if necessary, to be one more than the numeric value of that array index; and whenever the value of the length property is changed, every own property whose name is an array index whose value is not smaller than the new length is deleted. This constraint applies only to own properties of an Array object and is unaffected by length or array index properties that may be inherited from its prototypes.

In other words, an array's .length is a specific exception to the general rule that objects' properties do not change by themselves.

Note that getters can have a similar functionality:

const obj = {
  get length() {
    return Object.keys(this)
      .filter(key => /^[0-9]+$/.test(key))
      .length;
  }
};

obj[0] = 'x';
obj[1] = 'y';
console.log(obj.length);

But an array's .length is not a getter, at least not visibly:

var arr = [1,2,3,8,6,4,9,5,8,6];
console.log(Object.getOwnPropertyDescriptor(arr, 'length'))

If it were a getter, you'd instead see a get property on the descriptor, like:

const obj = {
  get length() {
    return Object.keys(this)
      .filter(key => /^[0-9]+$/.test(key))
      .length;
  }
};

console.log(Object.getOwnPropertyDescriptor(obj, 'length'))

Array length is all implemented under-the-hood, and not visible to the running Javascript.

Upvotes: 4

Related Questions