-1

the function returns 'Hello, world!' it's very confusing to understand trim and bind inside an array as string.

f=''['trim']['bind']`Hello, world!`()

  • 3
    I voted to reopen because the dupe doesn't answer the `\`Hello, world!\`` part. It's a tagged function / tagged template. You can call a function with backticks instead of parenthesis, e.g. `parseInt\`123\``. `f=''['trim']['bind']\`Hello, world!\`()` is equivalent to `f=''.trim.bind('Hello, world!')()` – Thomas Sablik Mar 03 '21 at 10:51
  • 1
    i was wondering the same why is it marked duplicated. thank you – ubaidh khatlani Mar 03 '21 at 10:53
  • 1
    I see someone has disabled this with a reference, but I thought this was very interesting so had a look into it. This is as far as I got: The blank string '' has string methods like .trim available to it. Using the bracket notation you can access the trim method with ''['trim']. Rather than calling the trim method though, you can call the bind method that is part of the prototype of trim. Bind can take a parameter (Hello World) and bind it to the function (trim) as the 'this' keyword. So the function when called will trim 'Hello World!'. – OBN Mar 03 '21 at 11:04
  • 1
    Ran out of space there (would like to make it a real answer!) The final piece is a string literal being used as a tagged template: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals This allows a template literal to be used as an argument to its preceding "tag", in this case the bound function. Calling the whole thing with () results in trimming 'Hello World!', which just returns the same string. Bind reference: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_objects/Function/bind – OBN Mar 03 '21 at 11:05
  • 1
    How can we get this reopened? – OBN Mar 03 '21 at 11:09
  • thank you. I have no idea how to reopen this question. maybe someone with higher points can – ubaidh khatlani Mar 03 '21 at 11:12
  • 1
    From https://stackoverflow.com/help/reopen-questions#:~:text=Users%20with%203%2C000%20reputation%20can,reopen%22%20link%20beneath%20the%20question. Users with 3,000 reputation can cast up to 50 reopen votes per day. When a question reaches 3 reopen votes, it is no longer closed, and new answers may be submitted. You may only vote to close or reopen a question once. To cast a reopen vote, click the "reopen" link beneath the question. – OBN Mar 03 '21 at 12:18
  • yes, only users with a reputation above 3000. i think I understand the problem now . i hope many users with above 3000 view this and reopen it . thank you – ubaidh khatlani Mar 03 '21 at 12:47
  • Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/229451/discussion-between-obn-and-ubaidh). – OBN Mar 03 '21 at 14:18
  • @ThomasSablik it sounds like you have an answer that you can post, rather than a comment you can leave. This won't get surfaced on google or SO search until there's an accepted answer, after all =) – Mike 'Pomax' Kamermans Mar 04 '21 at 01:02

1 Answers1

2

I hadn't seen something like this before. I found it very interesting so looked into how it works. Here's my attempt to explain:

  1. ''['trim'] -- The initial blank string '' has string methods like .trim() available to it. Using the bracket notation you can access the trim method with ''['trim'].

  2. ''['trim']['bind'] -- Rather than calling the trim method though (which would require adding () to the end), we call the .bind() method that is part of the prototype of trim, again using bracket notation. Bind takes its initial argument and binds it to the previous function (trim) as the 'this' keyword.

  3. ''['trim']['bind']`Hello, world!` -- The final piece here is passing the string 'Hello, world!' inside an array to the .bind() method. The notation here is a string literal being used as a tagged template. This allows a template literal to be used as an array argument to its preceding "tag", in this case the bound function. This is now equivalent to ['Hello, world!'].trim(). Trim coerces an array of strings to a string with each element separated by a comma. But as there is only 1 element, that single element is returned.

  4. f=''['trim']['bind']`Hello, world!`() -- Calling the whole thing with () at the end results in trimming 'Hello, world!', which just returns the same string as there is nothing to actually trim. It was all just a ruse to get to the string method's prototype!

OBN
  • 371
  • 2
  • 12
  • 1
    The template literal actually passes *an array containing the string `'Hello world!'`* as its sole element, which is coerced to a string by `trim`. Array stringification works by concatenating all of its element by commas, however, concatenating a single element results in the string representation of the element to be returned (as no commas can be added in this case). – FZs Mar 05 '21 at 11:39
  • 1
    Thank you, that's an important difference. I will update my answer. – OBN Mar 05 '21 at 12:30