this.className #btn.pushed;

javascript
1<!DOCTIPE html>
2<html lang="ja">
3<head>
4  <meta charset="utf-8">
5  <title>おみくじ</title>
6  <style>
7    body {
8      background: #e0e0e0;
9      text-align: center;
10      font-size: 16px;
11      color: #fff;
12      font-family: Arial, sans-serif;
13    }
14    #result {
15      margin: 30px auto;
16      width: 180px;
17      height: 180px;
18      border-radius: 50%;
19      line-height: 180px;
20      font-size: 48px;
21      font-weight: bold;
22      background: #f44336;
23      box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
24    }
25    #btn {
26      margin:0 auto;
27      width: 200px;
28      padding: 5px;
29      border-radius: 5px;
30      background: #00aaff;
31      box-shadow: 0 4px 0px #0088cc;
32      cursor: pointer;
33    }
34    #btn:hover {
35      opacity: 0.8;
36    }
37    #btn.pushed {
38      margin-top: 32px;
39      box-shadow: 0 2px 0px #0088cc;
40
41    }
42  </style>
43</head>
44<body>
45  <div id="result">?</div>
46  <div id="btn">あなたの運勢は？</div>
47  <script>
48  (function() {
49    "use strict";
50    document.getElementById("btn").addEventListener('click', function() {
51      document.getElementById('result').innerHTMLs = 'hit';
52    });
53    document.getElementById("btn").addEventListener('mousedown', function() {
54      this.className = 'pushed';
55    });
56    document.getElementById("btn").addEventListener('mouseup', function() {
57      this.className = '';
58     });
59  })();
60
61  </script>
62</body>
63</html>
64

javascript
1this.className = 'pushed';
2#btn.pushed;

thisがオブジェクトでclassNameはクラスですか？
なぜ具体→抽象なのでしょうか？ふつうは抽象→具体だと思います。
className = 'pushed'もvar 宣言がないので変数（インスタンス）ではありせんし

#btn.pushed; のpushedはメソッドですか？#btnがオブジェクトでそれなら理解できます。本に書いてありますので

行動規範の内容に同意します

回答2件

this === event.currentTarget

JavaScript
1document.getElementById("btn").addEventListener('mousedown', function() {
2  this.className = 'pushed';
3});

addEventListener は第二引数にとるイベントハンドラ関数において event.currentTarget に this 束縛します。
つまり、this === event.currentTarget です。

ハンドラー内での this の値 - EventTarget.addEventListener - Web API インターフェイス | MDN

このコードにクラス構文は使われていません。
勘違いされているといけないので念のため付け加えますが、「this を使う事」は「クラスである事」を指しているわけではありません。
イベントハンドラ関数の他にも Function.prototype.call や Function.prototype.bind で this 束縛する事もあり、this は様々な場所で使われます。

class セレクタ (class selector)

CSS
1#btn.pushed {
2  margin-top: 32px;
3  box-shadow: 0 2px 0px #0088cc;
4}

style要素内に書かれた記述はCSSです。
.pushed は「class セレクタ」と呼ばれるもので、指定したclassトークン(この場合は pushed)を持つ要素を選択します。
JavaScript においては querySelector 等でclassセレクタを指定する事が可能です。