Day1-键盘鼓点

event.KeyCode

keyCode 属性返回onkeypress事件触发的键的值的字符代码（表示 ASCII 字符的数字）。
提示： 如果需要知道用户按下的是打印键 (如 “a” 或 “5”)，建议使用 onkeypress 事件。如果需要知道用户按下的是功能键(如 “F1”, “CAPS LOCK” 或 “Home”) 可使用 onkeydown 或 onkeyup 事件。
查询：http://www.bejson.com/othertools/keycodes/

function printCode(event){
	console.log(event.keyCode);
}
//方式 1
window.addEventListener('keypress',printCode)
//方式 2
<input type="text" onkeypress="printCode(event)">

模板字符串

模板字符串可以包含特定语法（${expression}）的占位符。占位符中的表达式和周围的文本会一起传递给一个默认函数，该函数负责将所有的部分连接起来。在模版字符串内使用反引号（`）时，需要在它前面加转义符（\）。

var a = 5;
var b = 10;
//多行字符串普通拼接
console.log('Fifteen is ' + (a + b) + ' and\n'+
'not' + (2 * a + b) + '.');
// "Fifteen is 15 and
// not 20."

//插入表达式
console.log(`Fifteen is ${a + b} and
not ${2 * a + b}.`);
// "Fifteen is 15 and
// not 20."

document.querySelector

匹配指定 CSS 选择器的第一个元素，如果没有找到，返回 null。如果指定的选择器不合法，会抛出错误SyntaxError，如$("##div")。
parentNode.querySelectorAll回的对象是 NodeList 。
与getElementById的区别：https://blog.youkuaiyun.com/wzj2584454/article/details/78984685

element.classList

classList 属性返回元素的类名，该属性用于在元素中添加，移除及切换 CSS 类。classList 属性是只读的，可以使用 add() 和 remove() 方法修改它。

const div = document.createElement('div');
div.className = 'foo';

// our starting state: <div class="foo"></div>
console.log(div.outerHTML);

// use the classList API to remove and add classes
div.classList.remove("foo");
div.classList.add("anotherclass");

// <div class="anotherclass"></div>
console.log(div.outerHTML);

// replace class "foo" with class "bar"
div.classList.replace("foo", "bar");

// if visible is set remove it, otherwise add it
div.classList.toggle("visible");

removeEvent

forEach()

forEach 方法按升序为数组中含有效值的每一项执行一次callback 函数。
注意：forEach 遍历的范围在第一次调用 callback 前就会确定。调用 forEach 后添加到数组中的项不会被 callback 访问到。如果已经存在的值被改变，则传递给 callback 的值是 forEach 遍历到他们那一刻的值。已删除的项不会被遍历到。而且不像 map() 或者 reduce()，它总是返回 undefined 值，并且不可链式调用。典型用例是在一个链的最后执行副作用。

const fruits = ['apple','banana','lemon'];
const empty = [];

//for循环
for(let i=0;i<fruits.length;i++){
	empty.push(item[i])
}

//forEach
fruits.forEach((fruit) => {
	empty.push(fruit)
})
fruits.forEach((fruit,index) => {
	console.log(`[${index+1}]:${fruit}`)
})
//[1]:apple
//[2]:banana
//[3]:lemon

参考

MDN文档