构建工作流

两个典型工具gulp和webpack：

gulp官网 gulp.js

 webpack官网 webpack 中文文档 | webpack 中文网

开发工具

Visual Studio Code

技术预研

分析要做的需求，找出技术难点

针对每个技术难点进行攻克和测试

环境安装

Nodejs官网 Node.js

查看版本node -v

运行方式 node index.js 

console.log('hello world');
 
console.log(Date);
console.log(Math);
 
console.log(setTimeout);
console.log(setInterval);
console.log(setImmediate);
 
console.log(__filename);
console.log(__dirname);
 
# 进程对象
console.log(process);

 

# 石头剪刀布小游戏
# argv用于接收输入
var playerAction = process.argv[process.argv.length - 1];
 
var random = Math.random() * 3;
 
if (random < 1) {
    var computerAction = 'rock';
} else if (random > 2) {
    var computerAction = 'scissor';
} else {
    var computerAction = 'paper';
}
 
console.log('我出了' + computerAction);
 
if (computerAction == playerAction) {
    console.log('平局');
} else if (
    (computerAction === 'rock' && playerAction === 'paper') ||
    (computerAction === 'scissor' && playerAction === 'rock') ||
    (computerAction === 'paper' && playerAction === 'scissor')
) {
    console.log('你赢了');
} else {
    console.log('你输了');
}

前端如何加载js

一般在<script/>标签中，如果它有src属性，浏览器就会从远端下载一个js脚本并执行，如果没有src属性就会直接把script标签中的代码执行一遍。以前的这种方式存在一些问题：

• 脚本多变时，需要手动管理加载顺序
• 不同脚本之间逻辑调用，需要通过全局变量的方式通信
• 没有html

由此引入CommonJS模块规范。

# lib.js
 
module.exports = function() {
    var random = Math.random() * 3;
 
    if (random < 1) {
        var computerAction = 'rock';
    } else if (random > 2) {
        var computerAction = 'scissor';
    } else {
        var computerAction = 'paper';
    }
 
    console.log('我出了' + computerAction);
 
    if (computerAction == playerAction) {
        console.log('平局');
        return 0;
    } else if (
        (computerAction === 'rock' && playerAction === 'paper') ||
        (computerAction === 'scissor' && playerAction === 'rock') ||
        (computerAction === 'paper' && playerAction === 'scissor')
    ) {
        console.log('你赢了');
        return -1;
    } else {
        console.log('你输了');
        return 1;
    }
 
}

# index.js
# argv用于接收输入
var playerAction = process.argv[process.argv.length - 1];
const game = require('./lib');
 
#const result = game(playerAction);
#console.log(result)
 
let count = 0;
process.stdin.on('data', e=> {
    const playerAction = e.toString().trim();
    console.log(playerAction);
    const result = game(playerAction);
    
    if (result == -1) {
        count++;
    }
    if (result === 3) {
        console.log('你太厉害了，我不玩儿了！');
        process.exit();
    }
})