How does JavaScript split work on Arabic plus English number strings?

Question

When I tried splitting:

"بحد-8635".split('-')

then JavaScript gives me this result:

[0] - بحد,
[1] - 8635

console.log("بحد-8635".split('-'))

And when I tried splitting:

"2132-سسس".split('-')

it gives me this different result:

[0] - 2132
[1] - سسس

console.log("2132-سسس".split('-'))

How is this happening? How can this be implemented correctly?

I am unable to replicate the issue https://onecompiler.com/javascript/3v3946t3r It's splitting properly for the first string for me — karthikdivi, Sep 24 '19 at 07:09
I tried this in Chrome Dev Console and it does seem to be giving different results. Quite interesting. — Saharsh, Sep 24 '19 at 07:13
Possible duplicate [`Why does Javascript string replace reverse the word order for right to left languages?`](https://stackoverflow.com/questions/38977470/why-does-javascript-string-replace-reverse-the-word-order-for-right-to-left-lang) — Code Maniac, Sep 24 '19 at 07:34

score 16 · Accepted Answer · edited Sep 24 '19 at 20:56

16

It depends on how you type the string (left to right / right to left). In the provided question, "2132-سسس" was typed from left to right and "8635-بحد" was typed from right to left.

Check the below snippet.

console.log("Typed left to right:");
console.log("2132-سسس".split('-'));
console.log("8635-بحد".split('-'));

console.log("---------------");

console.log("Typed right to left as Arabians follow:");
console.log("سسس-2132".split('-'));
console.log("بحد-8635".split('-'));

edited Sep 24 '19 at 20:56

Peter Mortensen

30,738
21
105
131

answered Sep 24 '19 at 07:15

Ramesh

2,297
2
20
42

ok understood. But this string is coming in response from backend to frontend and it is giving random result. How can this be done? – Saurabh Arora Sep 24 '19 at 07:24
9

Thanks for answer. Can you elaborate on topic about "typed left to right and reverse"? They both looks eerily same with a glance. – Saharsh Sep 24 '19 at 07:27
1

@Saharsh You can use `dir="ltr"` or `dir="rtl"` to initialize the direction. Follow the link for a clear understanding: https://www.w3.org/International/questions/qa-html-dir – Ramesh Sep 24 '19 at 11:45

score 3 · Answer 2 · answered Sep 24 '19 at 16:50

Rather than treat text direction as an issue to be controlled at the markup or formatting layer, Unicode requires that it be processed at the character set level. In the absence of formatting characters that would force text direction, certain characters (such as Latin-alphabet letters) are displayed left to right, some (such as Arabic or Hebrew letters) are displayed right to left, and some (like punctuation marks) may be displayed in ways that depend upon previous characters, and some (like digits) may be displayed left-to-right as a group, but with groups being displayed according to the direction of the preceding text.

If the uppercase letters in the text (characters specified in order, left to right) abc123 456XYZdef were in a right-to-left alphabet, the text would be displayed as abc123 456ZYXdef, with the right-to-left characters being shown in right-to-left order. If the order of the characters had been (again, reading strictly left to right) had been abcXYZ456 123def it would be displayed as abc123 456ZYXdef because the two groups of numbers would be displayed in right-to-left order, to the left of the preceding right-to-left text, even though the numbers within each group would read left to right.

As a consequence of these rules, it's impossible to know the order of characters in a string just by looking at it. The only way to really know what's going on is to transliterate characters into forms like their hex representations which have a consistent ordering.

Code Maniac · Answer 3 · 2019-09-25T01:53:21.817

This depends on how your string is typed (ltr or rtl).

To understand the difference, set the dir attribute on input and then split the value:

function handleLTR() {
  let element = document.getElementById('default').value
  console.log(element.split('-'))
}

function handleRTL() {
  let element = document.getElementById('rtl').value
  console.log(element.split('-'))
}

<div>
  <input id='default' value=''></input>
  <button onClick=handleLTR()>Handle LTR</button>
</div>
<div>
  <input id='rtl' dir="rtl" value=''></input>
  <button onClick=handleRTL()>Handle RTL</button>
</div>

For more information, read about the difference between RTL and LTR.

score -1 · Answer 4 · answered Sep 24 '19 at 07:37

-1

Try this

console.log("2132-سسس".split('-').sort());
console.log("8635-بحد".split('-').sort());
console.log("سسس-2132".split('-').sort());
console.log("1-حد".split('-').sort());

answered Sep 24 '19 at 07:37

Arsalan Akhtar

395
2
15

6

Providing a code snippet without explaining to the OP what they were doing wrong does not help them learn. Beyond that your "solution" doesn't answer their question. – Marie Sep 24 '19 at 19:27

How does JavaScript split work on Arabic plus English number strings?

4 Answers4

Linked