Question 161555 in Javascript Question posted in
A very good W3school tutorial can be found here.

How to interpret this JS code with shorthand if & commas?

I found this function in code (compiled with webpack) and wanted to know how it works.

First, I see t.length > 100. So if its > 100, then next condition is being checked.
However, this condition contains , signs and I can’t figure out what they do.
We have 2 parts of code here
$(this).val(t.substring(0, 99)) , e = $(this).val().length

I assume, this is some kind of packing code and executing it as part of conditional statement, and it does not affect return?

function() {
  const t = $(this).val();
  let e = t.length;
  t.length > 100 && 
  (
    $(this).val(t.substring(0, 99)),
    e = $(this).val().length
  ),
  $(this).is("input:text") 
    ? $(".limit_text:visible").text(e) 
    : $(".limit_description:visible").text(e)
}

Looking at that, this code would do same?

function() {
  const t = $(this).val();
  let e = t.length;
  if (t.length > 100) {
    $(this).val(t.substring(0, 99));
    e = $(this).val().length
  }
  $(this).is("input:text") 
    ? $(".limit_text:visible").text(e) 
    : $(".limit_description:visible").text(e)
}

So is , same as ;

Tags:

2

Answers


  1. 0

    In JS, the comma and semicolon serve different purposes.
    In the code you provided, the comma is being used as an operator in the conditional statement. It allows multiple expressions to be evaluated sequentially, and the value of the entire expression is determined by the last expression in the sequence. In this case:

    t.length > 100 && ($(this).val(t.substring(0, 99)), e = $(this).val().length)

    The comma operator is used to separate two expressions within the parentheses. The first expression is $(this).val(t.substring(0, 99)), which sets the value of $(this) (presumably an input element) to a substring of its value. The second expression is e = $(this).val().length, which assigns the length of the modified value to the variable e. If t.length > 100 evaluates to true, both expressions are executed.

    In the alternative code you provided, the comma operator is replaced with semicolons (;) to separate individual statements within the if block. The equivalent code would be:

    if (t.length > 100) {
    $(this).val(t.substring(0, 99));
    e = $(this).val().length;
}
    Login or Signup to reply.
  2. 0

    The comma (,) and semicolon (;) are not the same in JavaScript. But they can be used interchangeably in some cases.

    In the first code snippet, the comma (,) is being used as an operator to combine multiple expressions where it evaluates each expression from left to right and returns the value of the last expression. Here, the , is being used to execute two statements inside parentheses as a single expression.

    The first statement sets the value of the input field to the first 99 characters of the original value using $(this).val(t.substring(0, 99)). The second statement e = $(this).val().length updates the value of e to the new length of the input field.

    The semicolon (;) is a statement terminator. Second code snippet is functionally equivalent to the first one, but uses an if statement to check the condition and separate the two statements with semicolons.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search