Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commitc9ed914

Browse files
authored
Table of Contents
1 parent12441ac commitc9ed914

File tree

1 file changed

+53
-41
lines changed

1 file changed

+53
-41
lines changed

‎README.md

Lines changed: 53 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,24 @@
1414
|8|[Get unique values in an array](#Get-unique-values-in-an-array)|
1515
|9|[Copy Text to Clipboard](#Copy-Text-to-Clipboard)|
1616
|10|[Nested Destructuring](#Nested-Destructuring)|
17+
|11|[URLSearchParams](#URLSearchParams)|
18+
|12|[Count elements in an array](#Count-elements-in-an-array)|
19+
|13|[Aliases with JavaScript Destructuring](#Aliases-with-JavaScript-Destructuring)|
20+
|14|[The Object.is() method determines whether two values are the same value](#The-Object.is()-method-determines-whether-two-values-are-the-same-value)|
21+
|15|[Freeze an object](#Freeze-an-object)|
22+
|16|[Printing Object keys and values](#Printing-Object-keys-and-values)|
23+
|17|[Capture the right click event](#Capture-the-right-click-event)|
24+
|18|[In HTML5, you can tell the browser when to run your JavaScript code](#In-HTML5,-you-can-tell-the-browser-when-to-run-your-JavaScript-code)|
25+
|19|[Nullish coalescing operator](#Nullish-coalescing-operator)|
26+
|20|[Optional chaining](#Optional-chaining)|
27+
|21|[globalThis](#globalThis)|
28+
|22|[The second argument of JSON.stringify lets you cherry-pick 🍒 keys to serialize.](#The-second-argument-of-JSON.stringify-lets-you-cherry-pick-🍒-keys-to-serialize)|
29+
|23|[Fire an event listener only once.](#Fire-an-event-listener-only-once)|
30+
|24|[Vanilla JS toggle](#Vanilla-JS-toggle)|
31+
|25|[Check if a string is a valid JSON](#Check-if-a-string-is-a-valid-JSON)|
32+
|26|[getBoundingClientRect](#getBoundingClientRect)|
33+
|27|[Check if a node is in the viewport](#Check-if-a-node-is-in-the-viewport)|
34+
1735

1836

1937

@@ -217,7 +235,8 @@ const { education : { degree } } = user;
217235
console.log(degree)//Masters
218236
```
219237

220-
#URLSearchParams
238+
**[⬆ Back to Top](#table-of-contents)**
239+
###URLSearchParams
221240

222241

223242
```javascript
@@ -232,22 +251,8 @@ console.log(urlParams.toString()); // "?post=1234&action=edit"
232251
console.log(urlParams.append('active','1'));// "?post=1234&action=edit&active=1"
233252
```
234253

235-
236-
#Shuffle an array
237-
238-
239-
```javascript
240-
constlist= [1,2,3,4,5,6,7,8,9];
241-
constshuffle=list.sort(func);
242-
243-
functionfunc(a,b){
244-
return0.5-Math.random();
245-
}
246-
247-
console.log(shuffle);
248-
```
249-
250-
#Count elements in an array
254+
**[⬆ Back to Top](#table-of-contents)**
255+
###Count elements in an array
251256

252257

253258
```javascript
@@ -272,8 +277,8 @@ const countMyFruits = myFruits.reduce((countFruits,fruit) => {
272277
// { Apple:3, Banana:1, Mango:2, Orange:1 }
273278
```
274279

275-
276-
#Aliases with JavaScript Destructuring
280+
**[⬆ Back to Top](#table-of-contents)**
281+
###Aliases with JavaScript Destructuring
277282

278283

279284
```javascript
@@ -293,8 +298,8 @@ console.log(pageName) // JSsnippets
293298
```
294299

295300

296-
297-
#The Object.is() method determines whether two values are the same value
301+
**[⬆ Back to Top](#table-of-contents)**
302+
###The Object.is() method determines whether two values are the same value
298303

299304

300305
```javascript
@@ -312,8 +317,8 @@ Object.is(foo, bar); // false
312317
```
313318

314319

315-
316-
#How can we freeze an object
320+
**[⬆ Back to Top](#table-of-contents)**
321+
###Freeze an object
317322

318323

319324
```javascript
@@ -342,8 +347,8 @@ Object.isFrozen(obj) //true
342347

343348
```
344349

345-
346-
#Printing Object keys and values
350+
**[⬆ Back to Top](#table-of-contents)**
351+
###Printing Object keys and values
347352

348353

349354
```javascript
@@ -365,7 +370,9 @@ for(let [key,value] of Object.entries(obj)){
365370
// order is not guaranteed
366371

367372
```
368-
#Capture the right click event
373+
374+
**[⬆ Back to Top](#table-of-contents)**
375+
###Capture the right click event
369376

370377
```javascript
371378
window.oncontextmenu= ()=> {
@@ -380,8 +387,8 @@ window.addEventListener('contextmenu', ()=>{
380387
},false)
381388
```
382389

383-
384-
#In HTML5, you can tell the browser when to run your JavaScript code
390+
**[⬆ Back to Top](#table-of-contents)**
391+
###In HTML5, you can tell the browser when to run your JavaScript code
385392
```javascript
386393

387394
//Without async or defer, browser will run your script immediately, before rendering the elements that's below your script tag.
@@ -395,7 +402,8 @@ window.addEventListener('contextmenu', ()=>{
395402
<script defer src="myscript.js"></script>
396403
```
397404

398-
#nullish coalescing operator
405+
**[⬆ Back to Top](#table-of-contents)**
406+
###Nullish coalescing operator
399407
```javascript
400408

401409
// an equality check against nullary values (e.g. null or undefined). Whenever the expression to the left of the ?? operator evaluates to either //undefined or null, the value defined to the right will be returned.
@@ -410,7 +418,8 @@ console.log(age);
410418
// expected output: "0"
411419
```
412420
413-
# Optional chaining
421+
**[⬆ Back to Top](#table-of-contents)**
422+
### Optional chaining
414423
```javascript
415424

416425
constcar= {}
@@ -433,7 +442,8 @@ console.log(newCarColor)
433442
//You can use this syntax today using @babel/plugin-proposal-optional-chaining
434443
```
435444
436-
# globalThis
445+
**[⬆ Back to Top](#table-of-contents)**
446+
### globalThis
437447
```javascript
438448
Accessing theglobal propertyin JavaScript has always posed somedifficulty.This is because
439449
different platforms have different ways to access it.
@@ -451,7 +461,7 @@ console.log(globalThis) //get the global this depends on your environment
451461
```
452462
453463
454-
464+
**[⬆ Back to Top](#table-of-contents)**
455465
# The second argument of JSON.stringify lets you cherry-pick 🍒 keys to serialize.
456466
```javascript
457467
constuser= {
@@ -478,8 +488,8 @@ returns
478488

479489
```
480490
481-
482-
# Fire an event listener only once.
491+
**[⬆ Back to Top](#table-of-contents)**
492+
### Fire an event listener only once
483493
```javascript
484494
constel=document.getElementById("btn");
485495

@@ -493,8 +503,8 @@ el.addEventListener('click', myClickHandler, {
493503
});
494504

495505
```
496-
497-
# Vanilla JS toggle
506+
**[⬆ Back to Top](#table-of-contents)**
507+
### Vanilla JS toggle
498508
```javascript
499509
constspan=document.querySelector("span");
500510
let classes=span.classList;
@@ -510,7 +520,9 @@ span.addEventListener("click", function() {
510520
});
511521

512522
```
513-
# Check if a string is a valid JSON
523+
524+
**[⬆ Back to Top](#table-of-contents)**
525+
### Check if a string is a valid JSON
514526
515527
```javascript
516528
functionisJson(str) {
@@ -524,8 +536,8 @@ function isJson(str) {
524536
returntrue;
525537
}
526538
```
527-
528-
# getBoundingClientRect
539+
**[⬆ Back to Top](#table-of-contents)**
540+
### getBoundingClientRect
529541
530542
```javascript
531543
//getBoundingClientRect provides you with important pieces of data about an
@@ -544,8 +556,8 @@ const bodyBounderies = document.body.getBoundingClientRect();
544556
// }
545557
```
546558
547-
548-
# Check if a node is in the viewport
559+
**[⬆ Back to Top](#table-of-contents)**
560+
### Check if a node is in the viewport
549561
bonus: add/remove animation depending if an image is in the viewport
550562
https://codepen.io/JSsnippets/pen/PoqrjEY
551563
```javascript

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp