井字遊戲 AI - 開始後用滑鼠點擊舞台以啟用按鍵，重整畫面即可重新遊戲。 | JavaScript 程式專案

{"id":172913,"student_id":2589,"content":"\n","created_at":"2020-07-28T17:30:56.393+08:00","updated_at":"2023-12-05T14:15:08.829+08:00","name":"井字遊戲 AI - 開始後用滑鼠點擊舞台以啟用按鍵，重整畫面即可重新遊戲。","language":"javascript","screenshot":{"url":"https://cdn5.koding.school/uploads/project/screenshot/172913/8bda028a749b1075cdebbeb479a12bfc.jpg"},"parent_id":3,"plugin":"Game.set({width: 1200, height: 900});\n\nsetBackdrop('#f8e8cc');\n\nvar scores = [0, 0, 0, 0, 0, 0, 0, 0, 0];\nvar grid = ['', '', '', '', '', '', '', '', ''];\nvar offsetX = 240;\nvar offsetY = 90;\nvar width = 240;\nvar turn = 'o';\n\nforever(loop);\nwhen('click', onclick);\n\nfunction check () {\n    var g = grid;\n    // 不直接返回改用陣列存放，是因為判斷時有可能同時 o 和 x 連線\n    // 固以 o 優先於 x 來判斷輸贏\n    var arr = [];\n    if (g[3] == g[4] \u0026\u0026 g[4] == g[5]) arr.push(g[3]);\n    if (g[0] == g[1] \u0026\u0026 g[1] == g[2]) arr.push(g[0]);\n    if (g[6] == g[7] \u0026\u0026 g[7] == g[8]) arr.push(g[6]);\n    if (g[0] == g[3] \u0026\u0026 g[3] == g[6]) arr.push(g[0]);\n    if (g[1] == g[4] \u0026\u0026 g[4] == g[7]) arr.push(g[1]);\n    if (g[2] == g[5] \u0026\u0026 g[5] == g[8]) arr.push(g[2]);\n    if (g[0] == g[4] \u0026\u0026 g[4] == g[8]) arr.push(g[0]);\n    if (g[2] == g[4] \u0026\u0026 g[4] == g[6]) arr.push(g[2]);\n    if (arr.includes('o')) return 'o';\n    if (arr.includes('x')) return 'x';\n    return false;\n}\n\nfunction onclick () {\n    var x = Math.floor((cursor.x - offsetX)/width);\n    var y = Math.floor((cursor.y - offsetY)/width);\n    var i = y*3 + x;\n    if (x \u003e 2 || y \u003e 2 || x \u003c 0 || y \u003c 0) return;\n    if (grid[i] !== '') return;\n    var olen = grid.filter(item =\u003e item == 'o').length;\n    var xlen = grid.filter(item =\u003e item == 'x').length;\n    grid[i] =  xlen \u003e= olen ? 'o' : 'x';\n    AI(grid);\n}\n\nfunction loop () {\n    var winner = check();\n    if (winner) {\n        text = winner + ' 獲勝！';\n        stop();\n    } else if (grid.indexOf('') === -1) {\n        text = '平手';\n        stop();\n    } else {\n        text = 'playing';\n    }\n    drawText(text , 500, 20, 'black', 45, 'Comic Sans MS');\n    \n    for (var i=0; i \u003c 9; i++) {\n        var x = i%3;\n        var y = (i - x)/3;\n        var xx = x*width + offsetX;\n        var yy = y*width + offsetY;\n        var color =  grid[i] == 'o' ? '#ff595a' : '#4a86e8';\n        \n        drawText(grid[i], xx + 40, yy, color, 240, 'Comic Sans MS');\n        \n        pen.size = 30;\n        pen.color = '#222';\n        pen.fillColor = '#fff';\n        pen.drawRect(xx, yy, 240, 240);\n    }\n}\n\nfunction showScore (score, i) {\n    var x = i%3;\n    var y = (i - x)/3;\n    var xx = x*width + offsetX + 20;\n    var yy = y*width + offsetY + 20;\n    print(score, xx, yy, 'black', 60, 'Comic Sans MS');\n}\n\n\n\ngrid[4] = 'o';\n\nforever(loopB); //不斷執行遊戲迴圈\n\n//遊戲迴圈中印出格子分數\nfunction loopB () {\n    for (var i=0; i\u003c9; i++) {\n        if (grid[i] == '') {\n            grid[i] = 'x';\n            var score = evaluate(grid);\n            grid[i] = 'o';\n            score += evaluate(grid);\n            grid[i] = '';\n            showScore(score, i);\n        }\n    }\n}\n\nfunction AI (grid) {\n    var bestIndex;\n    var bestScore = 0;\n    for (var i = 0; i \u003c 9; i++) {\n        if (grid[i] == '') {\n            grid[i] = 'x';\n            score = evaluate(grid);\n            grid[i] = 'o';\n            score += evaluate(grid);\n            if (score \u003e= bestScore) {\n                bestIndex = i;\n                bestScore = score;\n            }\n            grid[i] = '';\n        }\n    }\n    grid[bestIndex] = 'o';\n}\n\n//評估函式\nfunction evaluate (grid) {\n    var a = getScore(grid[0], grid[1], grid[2]);\n    var b = getScore(grid[3], grid[4], grid[5]);\n    var c = getScore(grid[6], grid[7], grid[8]);\n    var d = getScore(grid[0], grid[3], grid[6]);\n    var e = getScore(grid[1], grid[4], grid[7]);\n    var f = getScore(grid[2], grid[5], grid[8]);\n    var g = getScore(grid[0], grid[4], grid[8]);\n    var h = getScore(grid[2], grid[4], grid[6]);\n    return a + b + c + d + e + f + g + h;\n}\n\n//計算某一條線的分數\nfunction getScore (a, b, c) {\n    var line = a + b + c;\n    if (line == 'ooo') return 100;\n    if (line == 'xxx') return 100;\n    if (line == 'oo') return 10;\n    if (line == 'xx') return 10;\n    if (line == 'o') return 1;\n    if (line == 'x') return 1;\n    return 0; // s == ''\n}","description":null,"note":null,"status":"public","like_student_ids":[7418,7689,9413,5135,12489,16868],"is_featured":false,"views":735,"hashid":"rdvs9y6e","is_content_changed":false,"review_status":"unsubmitted","submitted_at":null,"reviewed_at":null,"advise":null,"is_deleted":false}