javascript语言入门、javascript基础入门视频教程 收藏 0

JavaScript如何入门？

1, 建议阅读“javascript高级程序设计”第三版电子版。（我刚开始学习，我向表哥（软件工程师）说我想做前端，于是，他帮我买了这本书，好的书大家都会推荐，很容易在网上找到，也没有必要我说一定是这本书就是这本书，可以自由选择）

经过前辈们的总结或本人的实践经历，自学的同学建议是这样，找本js入门的书和视频结合看。一个主攻面试，一个主攻实践。

看书的目的主要是掌握理论知识，梳理js的知识结构，最主要的一点是为了应付面试。面试的主要环节是为了表达自己的想法，只凭简单的理解，是不能完全的表达出一个问题的广度或深度，只有结合了行业中的术语约定或一些习惯叫法，表达出来的意思才更专业。如果不是这样，表达出来的意思别说面试官听不懂，连自己都感觉要么表达不出来，要么表达的不是想要的，我碰到了一位女生来面试，我们问她响应式什么？她说没听说，另外她说他工作一年了，再说到另一些术语，还要跟她解释了是什么，她不是不明白，只是没概念。

但书着重于对理论知识的阐述，缺少实际例子的支持，很难快速的消化。这时候视频可以弥补这个缺陷，而且视频用简单的代码实现一些常见的效果，学习兴趣很快就能被吸引。但是对js的高级特性，个人感觉视频没有达到那个深度。而且js的一些基础的问题，或一个知识的扩充，限于各种条件的限制，可能无法完全表达出来。所以要结合书来补充。

学习的心态是：不急，坚持。（每天要一定量，不能太多，也不能太少，看你的基础而定）

2, 建议欣赏，视频资料。

学习主要技巧是动手及主动思考，视频在欣赏的同时记得跟敲代码不低于三遍，直到隔一天隔一周能重复敲出代码或回忆起思路为止。而且边敲边做笔记，以做复习时快速的查阅之用。学习的最大技巧是动手，其实每天都在成长，只是感觉不明显而已。但这个月与前几月相比，已经有量的变化，量变引起质变。

敲出来的代码，思路不清晰时，可以在firebug,chrome里边打个断点跟一下，理理思路，理解代码的逻辑，这样影响才会深刻。初学者没办法都是这样，也只能这样。但是初期可能稍为慢一点，但一直不会这么慢，也不会想象的那么长，因为随着基本概念的掌握，编码技巧的熟悉，开发工具的熟练，消化视频的速度会越来越快。

另外一个建议：QQ群绝对不是学习的主战场，群只是学习的辅助手段，要是想安心学习就是关QQ，断网，靠自己。

我见过一个童鞋，问网页psd文件谁有，问了半天，说什么百度没psd文件，说什么怎么难啊，别人在群里刷屏，他也在群里刷，我恰好有些东西在群看，看到这位同学，我百度网页psd设计稿，百度显示第一就是网页psd下载，然后将链接地址发给他。就是这么简单的事，之后他说怎么差，说怎么办，群里刷屏，还在那里继续卖萌……请问这是学习吗?

上面例子说得不好听就是说学逗唱。因此，我们的学习的态度一定务实，生活是残酷的，战场是血腥的，一份耕耘，一份收获，务实的学习好基础才能走的更远。

敲出来的代码，思路不清晰时，可以在firebug,chrome里边打个断点跟一下，理理思路，理解代码的逻辑，这样影响才会深刻。初学者没办法都是这样，也只能这样。但是初期可能稍为慢一点，但一直不会这么慢，也不会想象的那么长，因为随着基本概念的掌握，编码技巧的熟悉，开发工具的熟练，消化视频的速度会越来越快。

视频：

http://zhinengshe.com/video.html

js视频

http://bbs.miaov.com/forum.php?mod=viewthread&tid=7385

http://www.miaov.com/2013/miaovideo/miaovideo.html

其它书籍总结分享：

http://www.cnblogs.com/Henrya2/archive/2009/01/22/1380096.html

js 书籍：

http://www.cnblogs.com/Darren_code/archive/2011/06/29/javascript-learn.html

js学习流程＋书籍

http://limu.iteye.com/blog/1267475

javascript那些书

http://www.javascript100.com/?p=394

如果学习js

http://limu.iteye.com/blog/1267475

javascript那些书

http://www.yaohaixiao.com/?p=8

写给想学JavaScript朋友的一点经验之谈

http://www.zhihu.com/question/19713563

如何循序渐进有效学习 JavaScript？

http://www.zhihu.com/question/20246142

前端其它资源

http://www.w3cplus.com/page/books.html

前端书籍分享

文/丁向明

做一个有博客的web前端自媒体人，专注web前端开发，关注用户体验，加我qq/微信交流：6135833

http://dingxiangming.com

最全javascript学习指南，快速了解从入门到精通需要掌握哪些知识

JavaScript（简称“JS”） 是一种具有函数优先的轻量级，解释型或即时编译型的编程语言。虽然它是作为开发Web页面的脚本语言而出名，但是它也被用到了很多非浏览器环境中，JavaScript 基于原型编程、多范式的动态脚本语言，并且支持面向对象、命令式、声明式、函数式编程范式。

JavaScript在1995年由Netscape公司的Brendan Eich，在网景导航者浏览器上首次设计实现而成。因为Netscape与Sun合作，Netscape管理层希望它外观看起来像Java，因此取名为JavaScript。但实际上它的语法风格与Self及Scheme较为接近。

JavaScript的标准是ECMAScript 。截至 2012 年，所有浏览器都完整的支持ECMAScript 5.1，旧版本的浏览器至少支持ECMAScript 3 标准。2015年6月17日，ECMA国际组织发布了ECMAScript的第六版，该版本正式名称为 ECMAScript 2015，但通常被称为ECMAScript 6 或者ES2015。

通过使用指南和教程来学习如何用JavaScript语言编程。

一些基本问题，比如“JavaScript 是什么？”、“它是怎么样的？”、“它可以用来做什么？”；同时还讨论如变量、字符串、数值和数组等 JavaScript 的核心特性。我们需要关注常见的代码块类型，如条件语句，循环，函数和事件。如果你想进一步使用该语言撰写更有效率的代码，理解 JavaScript 面向对象的精髓是很重要的。

好吧，上面太全了，来点精简版：

肉容中包含了ES6， 全称 ECMAScript 6.0 ，是 JavaScript 的下一个版本标准，2015.06 发版。

ES6 主要是为了解决 ES5 的先天不足，比如 JavaScript 里并没有类的概念，但是目前浏览器的 JavaScript 是 ES5 版本，大多数高版本的浏览器也支持 ES6，不过只实现了 ES6 的部分特性和功能。

ES6+常用的知识点结合如下：

1. 前言
2. ECMAScript 6简介
3. let 和 const 命令
4. 变量的解构赋值
5. 字符串的扩展
6. 字符串的新增方法
7. 正则的扩展
8. 数值的扩展
9. 函数的扩展
10. 数组的扩展
11. 对象的扩展
12. 对象的新增方法
13. 运算符的扩展
14. Symbol
15. Set 和 Map 数据结构
16. Proxy
17. Reflect
18. Promise 对象
19. Iterator 和 for…of 循环
20. Generator 函数的语法
21. Generator 函数的异步应用
22. async 函数
23. Class 的基本语法
24. Class 的继承
25. Module 的语法
26. Module 的加载实现
27. 编程风格
28. 读懂规格
29. 异步遍历器
30. ArrayBuffer
31. 最新提案
32. Decorator

1. JavaScript 简介
2. 手册与规范
3. 代码编辑器
4. 开发者控制台

1. Hello, world!
2. 代码结构
3. 现代模式，\”use strict\”
4. 变量
5. 数据类型
6. 交互：alert、prompt 和 confirm
7. 类型转换
8. 基础运算符，数学
9. 值的比较
10. 条件分支：if 和 \’?\’
11. 逻辑运算符
12. 空值合并运算符 \’??\’
13. 循环：while 和 for
14. \”switch\” 语句
15. 函数
16. 函数表达式
17. 箭头函数，基础知识
18. JavaScript 特性

1. 在浏览器中调试
2. 代码风格
3. 注释
4. 忍者代码
5. 使用 Mocha 进行自动化测试
6. Polyfill 和转译器

1. 对象
2. 对象引用和复制
3. 垃圾回收
4. 对象方法，\”this\”
5. 构造器和操作符 \”new\”
6. 可选链 \”?.\”

1. 对象 — 原始值转换
2. 数据类型
3. 原始类型的方法
4. 数字类型
5. 字符串
6. 数组
7. 数组方法
8. Iterable object（可迭代对象）
9. Map and Set（映射和集合）
10. WeakMap and WeakSet（弱映射和弱集合）
11. Object.keys，values，entries
12. 解构赋值
13. 日期和时间
14. JSON 方法，toJSON

1. 递归和堆栈
2. Rest 参数与 Spread 语法
3. 变量作用域，闭包
4. 旧时的 \”var\”
5. 全局对象
6. 函数对象，NFE
7. \”new Function\” 语法
8. 调度：setTimeout 和 setInterval
9. 装饰器模式和转发，call/apply
10. 函数绑定
11. 深入理解箭头函数

1. 属性标志和属性描述符
2. 属性的 getter 和 setter

1. 原型继承
2. F.prototype
3. 原生的原型
4. 原型方法，没有 __proto__ 的对象

1. Class 基本语法
2. 类继承
3. 静态属性和静态方法
4. 私有的和受保护的属性和方法
5. 扩展内建类
6. 类检查：\”instanceof\”
7. Mixin 模式

1. 错误处理，\”try…catch\”
2. 自定义 Error，扩展 Error

1. 简介：回调
2. Promise
3. Promise 链
4. 使用 promise 进行错误处理
5. Promise API
6. Promisification
7. 微任务（Microtask）
8. Async/await

1. Generator
2. 异步迭代和 generator

1. 模块 (Module) 简介
2. 导出和导入
3. 动态导入

1. Proxy 和 Reflect
2. Eval：执行代码字符串
3. 柯里化（Currying）
4. Reference Type
5. BigInt

学习如何管理浏览器页面：添加元素，操纵元素的大小和位置，动态创建接口并与访问者互动。

1. 浏览器环境，规格
2. DOM 树
3. 遍历 DOM
4. 搜索：getElement*，querySelector*
5. 节点属性：type，tag 和 content
6. 特性和属性（Attributes and properties）
7. 修改文档（document）
8. 样式和类
9. 元素大小和滚动
10. Window 大小和滚动
11. 坐标

1. 浏览器事件简介
2. 冒泡和捕获
3. 事件委托
4. 浏览器默认行为
5. 创建自定义事件

1. 鼠标事件
2. 移动鼠标：mouseover/out，mouseenter/leave
3. 鼠标拖放事件
4. 指针事件
5. 键盘：keydown 和 keyup
6. 滚动

1. 表单属性和方法
2. 聚焦：focus/blur
3. 事件：change，input，cut，copy，paste
4. 表单：事件和方法提交

1. 页面生命周期：DOMContentLoaded，load，beforeunload，unload
2. 脚本：async，defer
3. 资源加载：onload，onerror

1. DOM 变动观察器（Mutation observer）
2. 选择（Selection）和范围（Range）
3. 事件循环：微任务和宏任务

教程的前两部分未涉及的其他主题的内容列表。此处没有明确的层次结构，你可以按你需要的顺序阅读文章。

1. 弹窗和 window 的方法
2. 跨窗口通信
3. 点击劫持攻击

1. ArrayBuffer，二进制数组
2. TextDecoder 和 TextEncoder
3. Blob
4. File 和 FileReader

1. Fetch
2. FormData
3. Fetch：下载进度
4. Fetch：中止（Abort）
5. Fetch：跨源请求
6. Fetch API

1. XMLHttpRequest
2. 可恢复的文件上传
3. 长轮询（Long polling）
4. WebSocket
5. Server Sent Events

1. Cookie，document.cookie
2. LocalStorage，sessionStorage
3. IndexedDB

1. 贝塞尔曲线
2. CSS 动画
3. JavaScript 动画
4. Web components
5. 从星球轨道的高度讲起
6. Custom elements
7. 影子 DOM（Shadow DOM）

1. Shadow DOM 插槽，组成
2. 给 Shadow DOM 添加样式
3. Shadow DOM 和事件（events）

1. 模式（Patterns）和修饰符（flags）
2. 字符类
3. Unicode：修饰符 “u” 和 class \\p{…}
4. 锚点（Anchors)：字符串开始 ^ 和末尾 $
5. Flag \”m\” — 多行模式
6. 词边界：\\b
7. 转义，特殊字符
8. 集合和范围 […]
9. 量词 `+,*,?` 和 `{n}`
10. 贪婪量词和惰性量词
11. 捕获组
12. 模式中的反向引用：\\N 和 \\k<name>
13. 选择（OR）|
14. 前瞻断言与后瞻断言
15. 灾难性回溯
16. 粘性标志 \”y\”，在位置处搜索
17. 正则表达式（RegExp）和字符串（String）的方法

本文作者及来源:Renderbus瑞云渲染农场https://www.renderbus.com