/ By: BioMooc.com / At: 2024.10 / Version: dev0.2.8-5
Repo: github.com/dawnEve/jsLecture
js/php熟手交流QQ群: 369578518
js包括 语言核心、DOM、BOM共3部分。
为了方便调整目录结构，根文件夹都不加数字序号。根文件夹内的文件名命名: "数字开头+字母_关键词.html"
js主要有三种运行方式: 行内，script标签内，单独的文件。倾向于使用最后一种，尽量不使用第一种。
进几年，nodeJS 还可以后端运行。
示例模板:
/***************************
<meta charset='utf8'>
<h1></h1>
<pre>
</pre>
<script>
//tools
function print(s){console.log(s)}
</script>
***************************/
引用对象:Array、Object、Function
2. 控制结构
3. 字符串 String
4. 数组 Array
arr=[];//初始化
arr[0]=0;//赋值
arr.length;//数组长度
5. 对象 Object
var obj={};
new 和 this
6. Map 和 Set
7. iterable
标准对象
8. 日期 Date
9. 正则表达式 RegExp
10. JSON 对象
函数是js的一级公民，js的强大几乎全依仗着js函数的灵活与强大。函数可以是嵌套、作为参数、作为返回值。
函数式编程现在已经火起来，并与OOP并行。
1. 函数的定义与调用 递归 2. 变量作用域与结构赋值 只有全局变量和函数体局部变量； 只要首次出现不加var的都是全局变量：按照原型链上溯，最后添加到window对象上，就成全局变量了。 with() 严格模式下,with 被完全禁止 3. 方法 4. this 与 链式调用 5. arguments对象 6. 高阶函数 map/reduce filter sort Array 7. 闭包 与 立即执行函数 8. 箭头函数 9. generator
JS实现了基于原型的继承。
很难！原型链、闭包；模拟类
1. 创建对象
2. 原型继承
作用域scope、闭包closure、原型、继承、类的实现、
模块模式、沙箱模式、
单例模式、
- this的意义：当前对象本身，但是有很多意外解释//todo
- with(document){write('some text');}
- new: 创建新对象，new的时候发生了什么？
3. class 继承
几种类的实现方法: //todo all
1. minimalist.style.html
缺点是不节省资源，不提倡用；
2. create.class.html
很好用的类定义方法，就是不知道兼容性如何
3. single.class.html
js的单例模式：原型上写的属性和方法返回后失效。。。
也是合理的。
4. dragAndRisize:原生js图片头像截图上传_拖动图片切割头像截图上传
DOM 标签，是最复杂的部分。通过控制DOM及其属性，控制css，理论上能动态创建任何网页效果。
1.dom获取、dom创建、dom属性添加、dom插入、dom删除、dom克隆 https://blog.csdn.net/QWH_PYTHON/article/details/102758025 2.兼容性的处理 3.css属性获取与设定 4.其他标签 https://www.twle.cn/l/yufei/javascriptref/javascript-ref-met-video-canplaytype.html
浏览器的操作主要是：新窗口，location，history等。是基本不兼容性的，好在现在主流是chrome内核。
1. 原生交互 alert:弹出警告等信息； prompt:输入框,第一个参数是提示语句，第二个是默认值； confirm:确认框,很有用：你确认要删除吗？ 2.window - 当前窗口 - 新开窗口 - 通过本地窗口控制新开的窗口: 2秒后关闭 不过现在不常用了，因为被流氓网站用烂了。 6.本地存储 localStorage 浏览器嗅探，确定浏览器的能力。
xx
1.事件基础 (1)事件监听与绑定、取消绑定 https://zhuanlan.zhihu.com/p/29443137 (2)阻止冒泡 阻止默认事件 js事件之event.preventDefault()与event.stopPropagation()用法区别 http://www.111cn.net/wy/js-ajax/47345.htm js中的preventDefault与stopPropagation详解 http://www.jb51.net/article/46379.htm (3)事件委托 delegate 2.鼠标事件 js中鼠标滚轮事件详解 http://www.cnblogs.com/walkingp/archive/2010/02/03/1662872.html js鼠标滑轮滚动事件绑定（兼容主流浏览器） http://qiaolevip.iteye.com/blog/1673396 3.键盘事件 4.表单事件 onsubmit:表单提交之前，可做数据验证 js表单验证 1) 常规的是判断并弹出提示； 2) 毕向东Html、CSS、JavaScript视频教程 [1]保留 java怎么接收form的消息 [2] 给form加label的好处：【不大实用】 1.accessKey指定快捷键，需要配合alt键使用； 2.label的for属性指向input的id属性，可以使input快速获取焦点 操作文件 File API 5.自定义事件与主动触发事件 trigger or fire
xx
1.更有好的方式是避免弹窗，在末尾显示红色提示文字；
获得obj，在innerHTML中加入文字提示；
2.ajax
XHR、json、
网页画图主要靠 canvas 和 SVG。
xx
定时器、动画（链式运动、跳跃运动、）
1.产生动画的2个函数
setTimeOut('', 1000)
setInterval('', 2000)
2.时间
var today=new Date();
//Tue Nov 24 2015 16:41:42 GMT+0800 (中国标准时间)
//获取小时
var h=today.getHours();//16
3.js游戏控制
http://www.cnblogs.com/ljchow/archive/2010/06/10/1755182.html#xyqTTT
其博客列表：http://www.cnblogs.com/ljchow/default.html?page=2
0.学习方法：看API、看书、做练习
趣味代码：
- 黑客帝国
- 鼠标跟随
- 找相同图片
- 漂浮的云
- 打字效果
- 石头剪刀布
- 星球大战
读书进步快：读英文书
- 看目录
- 看例子代码
推荐的书
- javascript programmer's reference
- professional javascript for web developers
常见类库还是要学习的，甚至有必要看看源码。
在 /lib/ 下的主要是为了引用，学习笔记则在各自的一级目录下，比如 jQuery/。
目前有一个例外，就是 /lib/js/, /lib/JStest/，目前是自己的 js 函数库。
jQuery 架构设计与实现 https://github.com/JsAaron/jQuery/blob/master/README.md - 选择器 - 操作DOM 事件 动画 AJAX 扩展 underscore Collection Arrays Functions Objects Chaining
用来在当前 HTML 文档中嵌入另一个文档。
常用属性：
<iframe class=test id="mainFrame" name="box"
src="main2.html"
frameborder="0px" scrolling="auto"
marginwidth="0" marginheight="0">
</iframe>
try...catch...finally 语句。
1.错误处理 2. 错误传播 3. 异步错误处理
xx
xx
xx
xx
xx
xx
xx
要做成简单的效果，满足要求并简练是最好的效果。 -[1]ok 下拉换头像usefull->userPic.html -[2] 2/3级联动列表：onchange事件 -[3] 侧边滑动式菜单:onouseover滑动出来 -[4] 抽屉式菜单 -[5]ok 日历效果。插件式，点击获取oop_part->calender->calender.html 5.1梅花雨日历控件：demo失败，不能用。 -[6] 模拟alert的弹出层：httphttp://www.cnblogs.com/NNUF/archive/2012/04/26/2471120.html 延迟加载的原理： http://www.daxueit.com/article/3777.html http://www.cnblogs.com/NNUF/archive/2012/06/25/2561570.html -[7] 判断：是否为数字，是否为字符，是否为邮箱 -[8] 树结构 treeview.js，接口简单，写着困难。
http://bonsaiden.github.io/JavaScript-Garden/zh/