> For the complete documentation index, see [llms.txt](https://demirels-organization.gitbook.io/javascript-tutorial/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://demirels-organization.gitbook.io/javascript-tutorial/execution-order/digital-collectible-card-game-example.md).

# Digital Collectible Card Game example

Here is an example of execution order in the context of a digital collectible card game:

```javascript
class CardGame {
  constructor() {
    this.cards = [];
  }

  async loadCards() {
    console.log('Loading cards...');

    // This is an asynchronous operation
    const response = await fetch('https://example.com/cards');
    const data = await response.json();

    // This line of code will not run until the data has been retrieved
    this.cards = data;

    console.log('Cards loaded');
  }

  // Public method
  startGame() {
    console.log('Starting game with cards:');
    console.log(this.cards);
  }

  // Public method
  async playTurn() {
    console.log('Your turn');

    // Wait for player to make a move
    await new Promise(resolve => {
      document.querySelector('button').addEventListener('click', resolve);
    });

    console.log('Processing move...');

    // Wait 1 second before ending turn
    await new Promise(resolve => setTimeout(resolve, 1000));

    console.log('Turn over');
  }
}

const game = new CardGame();

game.loadCards();

game.startGame();

// This function call is asynchronous
game.playTurn();

console.log('Waiting for turn to end...');
```

In this example, the `CardGame` class has several methods that affect the execution order: `loadCards`, `startGame`, and `playTurn`.

The `loadCards` method performs an asynchronous operation to retrieve a list of cards from a server. The `startGame` method is called after the `loadCards` method, but because `loadCards` is asynchronous, the `startGame` method may not be called until after the cards have been retrieved.

The `playTurn` method is also asynchronous, and waits for the player to make a move by listening for a button click event. Once the player has made their move, the method waits for 1 second before ending the turn.

The execution order in this example is as follows:

1. `console.log('Loading cards...')`
2. `console.log('Starting game with cards:')`
3. `console.log('Your turn')`
4. `console.log('Waiting for turn to end...')`
5. `console.log('Cards loaded')` (when the cards have been retrieved)
6. `console.log('Processing move...')` (when the player has made their move)
7. `console.log('Turn over')` (1 second after the player has made their move)

The execution order in this example is affected by the use of asynchronous operations and event handlers. Understanding the execution order is important for writing correct and efficient code in a digital collectible card game.
