Skip to content

Commit 9ed29b0

Browse files
fix: "…" spread syntax is not an "operator" but document saying that is an "operator" so it can make developers confused (reactjs#4209)
1 parent 45aba8b commit 9ed29b0

File tree

10 files changed

+14
-14
lines changed

10 files changed

+14
-14
lines changed

beta/src/pages/blog/2014/10/28/react-v0.12.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,7 @@ You can read the full text of the [LICENSE](https://github.com/facebook/react/bl
6565

6666
#### New Features {/*new-features*/}
6767

68-
- Spread operator (`{...}`) introduced to deprecate `this.transferPropsTo`
68+
- Spread syntax (`{...}`) introduced to deprecate `this.transferPropsTo`
6969
- Added support for more HTML attributes: `acceptCharset`, `classID`, `manifest`
7070

7171
#### Deprecations {/*deprecations*/}

beta/src/pages/blog/2015/02/24/react-v0.13-rc1.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,7 @@ We've also published version `0.13.0-rc1` of the `react` and `react-tools` packa
6666
- `--target` option is available on the jsx command, allowing users to specify and ECMAScript version to target.
6767
- `es5` is the default.
6868
- `es3` restored the previous default behavior. An additional transform is added here to ensure the use of reserved words as properties is safe (eg `this.static` will become `this['static']` for IE8 compatibility).
69-
- The transform for the call spread operator has also been enabled.
69+
- The transform for the call spread syntax has also been enabled.
7070

7171
### JSX {/*jsx*/}
7272

beta/src/pages/blog/2015/03/10/react-v0.13.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,7 @@ We've also published version `0.13.0` of the `react` and `react-tools` packages
7979
- `--target` option is available on the jsx command, allowing users to specify and ECMAScript version to target.
8080
- `es5` is the default.
8181
- `es3` restores the previous default behavior. An additional transform is added here to ensure the use of reserved words as properties is safe (eg `this.static` will become `this['static']` for IE8 compatibility).
82-
- The transform for the call spread operator has also been enabled.
82+
- The transform for the call spread syntax has also been enabled.
8383

8484
### JSX {/*jsx*/}
8585

beta/src/pages/learn/updating-arrays-in-state.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -143,7 +143,7 @@ button { margin-left: 5px; }
143143

144144
</Sandpack>
145145

146-
The array spread operator also lets you prepend an item by placing it *before* the original `...artists`:
146+
The array spread syntax also lets you prepend an item by placing it *before* the original `...artists`:
147147

148148
```js
149149
setArtists([
@@ -334,7 +334,7 @@ button { margin: 5px; }
334334

335335
### Inserting into an array {/*inserting-into-an-array*/}
336336

337-
Sometimes, you may want to insert an item at a particular position that's neither at the beginning nor at the end. To do this, you can use the `...` array spread operator together with the `slice()` method. The `slice()` method lets you cut a "slice" of the array. To insert an item, you will create an array that spreads the slice _before_ the insertion point, then the new item, and then the rest of the original array.
337+
Sometimes, you may want to insert an item at a particular position that's neither at the beginning nor at the end. To do this, you can use the `...` array spread syntax together with the `slice()` method. The `slice()` method lets you cut a "slice" of the array. To insert an item, you will create an array that spreads the slice _before_ the insertion point, then the new item, and then the rest of the original array.
338338

339339
In this example, the Insert button always inserts at the index `1`:
340340

@@ -398,7 +398,7 @@ button { margin-left: 5px; }
398398

399399
### Making other changes to an array {/*making-other-changes-to-an-array*/}
400400

401-
There are some things you can't do with the spread operator and non-mutating methods like `map()` and `filter()` alone. For example, you may want to reverse or sort an array. The JavaScript `reverse()` and `sort()` methods are mutating the original array, so you can't use them directly.
401+
There are some things you can't do with the spread syntax and non-mutating methods like `map()` and `filter()` alone. For example, you may want to reverse or sort an array. The JavaScript `reverse()` and `sort()` methods are mutating the original array, so you can't use them directly.
402402

403403
**However, you can copy the array first, and then make changes to it.**
404404

@@ -442,7 +442,7 @@ export default function List() {
442442

443443
</Sandpack>
444444

445-
Here, you use the `[...list]` spread operator to create a copy of the original array first. Now that you have a copy, you can use mutating methods like `nextList.reverse()` or `nextList.sort()`, or even assign individual items with `nextList[0] = "something"`.
445+
Here, you use the `[...list]` spread syntax to create a copy of the original array first. Now that you have a copy, you can use mutating methods like `nextList.reverse()` or `nextList.sort()`, or even assign individual items with `nextList[0] = "something"`.
446446

447447
However, **even if you copy an array, you can't mutate existing items _inside_ of it directly**. This is because copying is shallow--the new array will contain the same items as the original one. So if you modify an object inside the copied array, you are mutating the existing state. For example, code like this is a problem.
448448

beta/src/pages/learn/updating-objects-in-state.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1123,7 +1123,7 @@ select { margin-bottom: 10px; }
11231123

11241124
The problem was in the mutation inside `handleMove`. It mutated `shape.position`, but that's the same object that `initialPosition` points at. This is why both the shape and the background move. (It's a mutation, so the change doesn't reflect on the screen until an unrelated update--the color change--triggers a re-render.)
11251125

1126-
The fix is to remove the mutation from `handleMove`, and use the spread operator to copy the shape. Note that `+=` is a mutation, so you need to rewrite it to use a regular `+` operation.
1126+
The fix is to remove the mutation from `handleMove`, and use the spread syntax to copy the shape. Note that `+=` is a mutation, so you need to rewrite it to use a regular `+` operation.
11271127

11281128
<Sandpack>
11291129

content/blog/2014-10-28-react-v0.12.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,7 @@ You can read the full text of the [LICENSE](https://github.com/facebook/react/bl
6666

6767
#### New Features {#new-features}
6868

69-
* Spread operator (`{...}`) introduced to deprecate `this.transferPropsTo`
69+
* Spread syntax (`{...}`) introduced to deprecate `this.transferPropsTo`
7070
* Added support for more HTML attributes: `acceptCharset`, `classID`, `manifest`
7171

7272
#### Deprecations {#deprecations}

content/blog/2015-02-24-react-v0.13-rc1.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -69,7 +69,7 @@ We've also published version `0.13.0-rc1` of the `react` and `react-tools` packa
6969
* `--target` option is available on the jsx command, allowing users to specify and ECMAScript version to target.
7070
* `es5` is the default.
7171
* `es3` restored the previous default behavior. An additional transform is added here to ensure the use of reserved words as properties is safe (eg `this.static` will become `this['static']` for IE8 compatibility).
72-
* The transform for the call spread operator has also been enabled.
72+
* The transform for the call spread syntax has also been enabled.
7373

7474

7575
### JSX {#jsx}

content/blog/2015-03-10-react-v0.13.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -81,7 +81,7 @@ We've also published version `0.13.0` of the `react` and `react-tools` packages
8181
* `--target` option is available on the jsx command, allowing users to specify and ECMAScript version to target.
8282
* `es5` is the default.
8383
* `es3` restores the previous default behavior. An additional transform is added here to ensure the use of reserved words as properties is safe (eg `this.static` will become `this['static']` for IE8 compatibility).
84-
* The transform for the call spread operator has also been enabled.
84+
* The transform for the call spread syntax has also been enabled.
8585

8686

8787
### JSX {#jsx}

content/docs/jsx-in-depth.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -231,7 +231,7 @@ In general, we don't recommend *not* passing a value for a prop, because it can
231231

232232
### Spread Attributes {#spread-attributes}
233233

234-
If you already have `props` as an object, and you want to pass it in JSX, you can use `...` as a "spread" operator to pass the whole props object. These two components are equivalent:
234+
If you already have `props` as an object, and you want to pass it in JSX, you can use `...` as a "spread" syntax to pass the whole props object. These two components are equivalent:
235235

236236
```js{7}
237237
function App1() {
@@ -244,7 +244,7 @@ function App2() {
244244
}
245245
```
246246

247-
You can also pick specific props that your component will consume while passing all other props using the spread operator.
247+
You can also pick specific props that your component will consume while passing all other props using the spread syntax.
248248

249249
```js{2}
250250
const Button = props => {

content/warnings/unknown-prop.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ function MyDiv(props) {
3333
}
3434
```
3535

36-
**Good:** The spread operator can be used to pull variables off props, and put the remaining props into a variable.
36+
**Good:** The spread syntax can be used to pull variables off props, and put the remaining props into a variable.
3737

3838
```js
3939
function MyDiv(props) {

0 commit comments

Comments
 (0)