This commit is contained in:
Ilya Kantor 2019-10-10 17:29:27 +03:00
parent 7418213b66
commit 6d44c1e1ac
5 changed files with 7 additions and 8 deletions

View file

@ -160,13 +160,13 @@ For instance:
let arr = [1, 2];
// create an array from: arr and [3,4]
alert( arr.concat([3, 4])); // 1,2,3,4
alert( arr.concat([3, 4]) ); // 1,2,3,4
// create an array from: arr and [3,4] and [5,6]
alert( arr.concat([3, 4], [5, 6])); // 1,2,3,4,5,6
alert( arr.concat([3, 4], [5, 6]) ); // 1,2,3,4,5,6
// create an array from: arr and [3,4], then add values 5 and 6
alert( arr.concat([3, 4], 5, 6)); // 1,2,3,4,5,6
alert( arr.concat([3, 4], 5, 6) ); // 1,2,3,4,5,6
```
Normally, it only copies elements from arrays. Other objects, even if they look like arrays, are added as a whole:
@ -180,7 +180,6 @@ let arrayLike = {
};
alert( arr.concat(arrayLike) ); // 1,2,[object Object]
//[1, 2, arrayLike]
```
...But if an array-like object has a special `Symbol.isConcatSpreadable` property, then it's treated as an array by `concat`: its elements are added instead:

View file

@ -69,7 +69,7 @@ As you can see, `x/y` and `width/height` fully describe the rectangle. Derived p
Please note:
- Coordinates may be decimal fractions, such as `10.5`. That's normal, internally browser uses fractions in calculations. We don't have to round them when setting to `style.position.left/top`.
- Coordinates may be decimal fractions, such as `10.5`. That's normal, internally browser uses fractions in calculations. We don't have to round them when setting to `style.left/top`.
- Coordinates may be negative. For instance, if the page is scrolled so that `elem` is now above the window, then `elem.getBoundingClientRect().top` is negative.
```smart header="Why derived properties are needed? Why does `top/left` exist if there's `x/y`?"

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 13 KiB

Before After
Before After

View file

@ -22,7 +22,7 @@ Then the ball will be positioned relatively to the field:
}
```
Next we need to assign the correct `ball.style.position.left/top`. They contain field-relative coordinates now.
Next we need to assign the correct `ball.style.left/top`. They contain field-relative coordinates now.
Here's the picture:
@ -36,7 +36,7 @@ To get field-relative `left` coordinate of the click, we can substract the field
let left = event.clientX - fieldCoords.left - field.clientLeft;
```
Normally, `ball.style.position.left` means the "left edge of the element" (the ball). So if we assign that `left`, then the ball edge, not center, would be under the mouse cursor.
Normally, `ball.style.left` means the "left edge of the element" (the ball). So if we assign that `left`, then the ball edge, not center, would be under the mouse cursor.
We need to move the ball half-width left and half-height up to make it center.

Binary file not shown.