js入门经典学习小结
简介
js是解释型语言，虽然名字有java，但和java，c等编译型语言不同，它是解释型的，类似perl，py
历史
90年代最早js 1.0版本是网景navigator2引入的
然后欧洲计算机制造商协会（ECMA）制定ECMASript规范
然后微软开发自己的javascript： jScript
90年代后期网景navigator4和IE4都支持js，但各自的实现方式不同，规范也不同，让开发者感到复杂。然后W3C通过DOM规范各厂商对界面操作的规范
dom
浏览器加载页面，有一个页面结构的内部体系存在内存里，叫DOM，是树形结构，可通过js方便操作dom。
树形结构顶层对象是window对象，它也是全局对象，具有全局作用域，window四个子对象是document， location，history，navigator。html界面都在document对象下，document对象用的也比较多，如果需要对document对象操作，直接执行document.getElementByNames(...)，也可以带全局对象操作：window.document.getElementByNames(...)
document有属性document.write('text')，但这个好像会覆盖document下其他元素，不推荐，推荐用dom操作页面对象
如何定义js脚本
两种方法，一种是写到html标签里，一种是写在js文件里，然后在html里用script标签的src属性引入自定义的js文件
// test/test.js
function () {alert('hello world');}<script>function() {alert('hello world');}</script>
<script src="/test/test.js"></script>注意，如果用src引入外部js文件，则html的script标签里不能有任何内容
虽然js文件后缀是.js，但浏览器其实可以无视后缀，即你后缀不对但文件内容对也能加载出来
创建简单脚本
思考1 js定义在html还是js脚本
js如果在html定义，放在head还是body？
如果放在body，会解释执行，但是是按顺序的，如果dom没加载出来但js访问了那就会报错，所以如果要定义在body，需要把script放在body末尾
如果放在head，当在body调用时，body肯定都已经加载完了，放在head更易读，也避免了放在body元素未加载完调用js报错问题
思考2 js关于大小写
html不区分大小写 js区分大小写 xhtml区分大小写
注释
单行注释：// this is a note
多行注释: /* this is \n another note */
文件大小
带注释的js文件会稍微大点，一般生产环境部署会压缩js文件，压缩后文件后缀一般是xxx.min.js
关于事件
js用事件处理器处理事件，常见的有onClick，onMouseOver，onMouseOut等，这三个几乎可以用于任何html元素
关于空行
html不会处理空行，除非你用转义字符表示空行
函数
尝试一下
<script>
function buttonReport(buttonId, buttonName, buttonValue) {var a = "button id: " + buttonId + "\n";var b = "button name: " + buttonName + "\n";var c = "button value: " + buttonValue + "\n";alert(a + b + c);
}
</script>
<div class="testb"><input id="abc" name="def" value="ghi" onclick="buttonReport(this.id, this.name, this.value)"/>test</div>返回值
函数没返回值的话则是undefined
匿名函数
看个例子
<script>
var sayHello = function () {alert("hello world");};
</script>
<div class="testb"><p onclick="sayHello()">test</p></div>更多函数知识
变量作用域
js有 全局作用域 函数作用域 块级作用域
var可声明全局作用域和函数作用域，块级作用域需要用let声明 块的定义可以理解为一个大括号
函数内部如果调用函数外同名变量，如果没有在函数里重新用var声明，则调用的是全局变量，即函数外的变量，在函数内改变这个变量，外部变量也会改变，因为改的是全局变量，是全局作用域
如果在函数内部用var重新声明了外部同名变量，这时这个变量就是函数作用域的了
用let声明的是块级作用域
this
html标签里调用时使用this，表示调用当前的标签对象，需注意的是this后加的属性需要元素拥有才能调用，否则报错，注意注意在注意
如果在js函数内部调用this，则this表示的是调用这个函数的父对象
const
用const可以声明常量，用const声明的常量，不能修改值，也不能重新用var定义，也不能重新用const定义为其他常量
箭头函数
可以理解为匿名函数的另一种简便写法
var sayHello = () => alert('hello world')
默认参数
默认参数一般放在参数列表的末尾，顺序不能错，类似py
dom对象和内置对象
常见用户交互对象方法
alert 类似py的print
confirm 弹出一个模态框 有ok cancel按钮 文本是confirm传入的参数
var sayHello = () => {confirm('hello world');};prompt 和confirm类似，弹出一个模态框，有一个输入框，最后的值是你输入的值，还提供第二个参数作为输入框里的默认值
var sayHello = () => {prompt('hello world');};
var sayHello = () => {prompt('hello world', "hello kitty");};常用元素属性方法
根据id或name访问元素：即document.getElementById 注意该方法和document.getElementsByName的区别，一个获取的是单元素，一个获取的是多元素，多元素拿到要再通过下标访问
interHTML：闭合标签夹着的内容可通过修改元素的interHTML属性来修改实现
window.history
可通过history的方法forward backward go三个方法访问历史url，三个方法执行结果分别为前进，后退，按执行参数前进或后退n个页面
window.location
该属性包含了当前页面url信息
应用：
href可以设为location.href实现访问
location.reload()表示刷新页面
window.navigator
保存浏览器本身数据 这个数据长让人捉摸不透 感觉书里不很建议用这个属性
日期和时间
var abc = new Date();
var year = abc.getFullYear();
var month = abc.getMonth();
var date = abc.getDate();
var day = abc.getDay();
var hour = abc.getHours();
var minutes = abc.getMinutes();
var seconds = abc.getSeconds();
with
类似py，例如调用某个模块（math）的方法，使用with，省去了对模块名的访问