Skip to content

JavaScript学习总结;前端变化太快,只有把JS基础打扎实了,才能游刃有余;为了让我的JavaScript基础异常牢固,思路更加清晰,我会把以前总结过的知识和平时看到的资料放在这里,把以前零零散散的知识点全部串起来!我把JavaScript理解成一朵三叶草;这个项目也许写到最后会是一个非常不错的JavaScript教程,希望可以帮到更多的人;收藏请点star;关注请点watch,如果发现我有写错误的,欢迎随时帮我指出来,谢谢!

Notifications You must be signed in to change notification settings

Webchange/My-JavaScript-is-a-clover

Repository files navigation

#我的JavaScript是一朵三叶草

JavaScript由ECMAScript、DOM(Document Object Model)、BOM(Browser Object Model)三部分组成;其中ECMAScript定义了JS的书写规范和语法;BOM可以操作与浏览器的交互;DOM可以让我们操作网页的内容;根据宿主(浏览器)的不同,具体的表现形式也不尽相同,ie和其他的浏览器风格不同。

javacsript是通过访问BOM对象来访问、控制、修改客户端(浏览器);window对象的属性和方法是直接可以使用而且被感知的;由于BOM的window包含了document,因此可以直接使用window对象的document属性;通过document属性就可以访问、检索、修改XHTML文档内容与结构。因为document对象又是DOM模型的根节点。

可以说,BOM包含了DOM(对象),浏览器提供出来给予访问的是BOM对象,从BOM对象再访问到DOM对象,从而JavaScript可以操作浏览器以及浏览器读取到的文档。

JavaScript中我们学的所有的知识点其实都是基于浏览器内置类实现的,这也说明了js是由一个个类组成的,而我们要学习的就是类、实例的关系和类上面的私有或者公有的属性或者方法---这就是我们经常听到的面向对象编程 ##目录

1、ECMAScript

由ECMA-262定义,提供核心语言功能。

  1. 基本概念
    • 语法规范
    • 关键字和保留字
    • 变量命名、声明、变量类型、作用域、闭包、垃圾回收机制
    • 数据类型(基本数据类型和引用数据类型)
    • 运算符/操作符
    • 流程语句(循环、跳转、判断/选择、异常处理)
    • 函数的参数理解
    • 定时器
  2. 预解释
    • 语法规范
    • 关键字和保留字
    • 变量
    • 数据类型
  3. this关键字和函数表达式
    • 定义
    • 调用
    • 方法call和apply
    • arguments
    • 函数参数指针标识
  4. 深入解读具体的引用数据类型以及它们的方法
    • Object类型
    • Array类型
    • Date类型以及日历控件
    • RegExp
    • Function类型
    • 基本包装类型(Boolean/Number/String)
    • 单体内置对象(Global对象/Math对象)
  5. 面向对象的程序设计
    • 面向对象
    • 创建对象
    • 继承
    • 使用面向对象的思想扩展数组类
  6. JSON数据高20
    • 模块化开发
    • 模块化开发
  7. 兼容性处理、错误处理与调试高17章
    • 模块化开发
    • 模块化开发

2、DOM

文档对象模型,提供访问和操作网页内容的方法和接口,DOM 是W3C的标准;所有浏览器公共遵守的标准。

  1. 节点获取
    • 通过上下文获取节点
    • 通过节点指针获取节点
  2. 节点操作
    • 增删改查
  3. 属性操作
    • 获取属性
    • 设置属性
    • 判断属性
  4. 文本操作
    • 获取属性
    • 设置属性
    • 判断属性
  5. JS中的盒子模型
    • 盒子模型
    • 图片加载机制
    • 图片延迟加载实例
  6. 自己动手封装DOM库
    • 单例子模式
    • 构造函数模式
    • 构造函数模式2
  7. 案例练习
    • 模块化开发之日历控件开发
    • 模块化开发之选项卡组件
  8. 事件
    • 事件的实现(事件的绑定)
    • DOM元素的默认行为
    • 事件传播和阻止事件传播
    • 事件委托
  9. DOM二级事件
    • DOM2和DOM3
    • 事件的常见兼容性问题总结
    • DOM二级时间兼容性问题解决质疑:this关键字;
    • DOM二级时间兼容性问题解决质疑:执行顺序问题;
  10. 拖拽效果
    • 拖拽效果的编写和优化
    • 写在HTML标签里的事件是 如何被浏览器解析并执行的
    • 给拖拽加效果并且发现代码在设计思想上的问题;
    • 优化上一章讲的事件库;
    • 给拖拽加更多动画效果;
  11. 照片墙示例
    • 基于模块化开发
    • 观察者模式
    • 面向对象及原型的继承;
    • 事件原理;
    • 事件库;

3、BOM

提供与浏览器交互的方法和接口,BOM 是 各个浏览器厂商根据 DOM在各自浏览器上的实现;[表现为不同浏览器定义有差别,实现方式不同]。

BOM的核心是window,而window对象又具有双重角色,它既是通过js访问浏览器窗口的一个接口,又是一个Global(全局)对象。这意味着在网页中定义的任何对象,变量和函数,都以window作为其global对象。

BOM主要是学window对象;window包括以下

  1. 对话框

    • 模块化开发
    • 模块化开发
  2. 定时器

    • 模块化开发
    • 模块化开发
  3. 焦点控制

    • 模块化开发
    • 模块化开发
  4. 窗口控制

    • 模块化开发
    • 模块化开发
  5. 打开关闭窗口

    • 模块化开发
    • 模块化开发
  6. 属性

    • 模块化开发
    • 模块化开发
  7. navigation 导航器对象

    • 模块化开发
    • 模块化开发
  8. screen 显示器对象

    • 模块化开发
    • 模块化开发
  9. history 历史对象

    • 模块化开发
    • 模块化开发
  10. location 位置对象

    • 模块化开发
    • 模块化开发
  11. document 文档对象

    • 模块化开发
    • 模块化开发
  12. 客户端检测高9章

    • 模块化开发
    • 模块化开发
  13. HTTP

    • WEB客户端和服务器
    • HTTP事务
    • HTTP报文
    • HTTP方法
    • GET和POST的区别
    • HTTP状态码
    • MIME Type
    • URI、URL、URN
  14. AJAX与Comet

    • 什么是AJAX
    • 网页渲染的同步和异步区别
    • 浏览器兼容性
    • 如何发起AJAX
    • 使用XMLHttpRequest
    • 在低版本IE浏览器中使用ActiveXObject时需要注意的地方
    • 模仿jQuery封装AJAX库
    • 表单操作/表单脚本高三14章
    • 利用AJAX模拟表单提交
    • 跨域请求操作
    • W3C规定的跨域资源共享中服务器可以返回的头信息
  15. 离线应用与客户端存储高23章

    • 离线监测
    • 应用缓存
    • 数据存储
  16. 高级技巧高22章

    • 高级函数
    • 防篡改对象
    • 高级定时器
    • 自定义事件
    • 拖放
  17. 最佳实践高24章

    • 可维护性
    • 性能
    • 部署

↑ 返回目录

如果把JavaScript看成三叶草的话,那么jQuery就是三叶草的第四片叶子

jQuery is fourth leaves of JavaScript

About

JavaScript学习总结;前端变化太快,只有把JS基础打扎实了,才能游刃有余;为了让我的JavaScript基础异常牢固,思路更加清晰,我会把以前总结过的知识和平时看到的资料放在这里,把以前零零散散的知识点全部串起来!我把JavaScript理解成一朵三叶草;这个项目也许写到最后会是一个非常不错的JavaScript教程,希望可以帮到更多的人;收藏请点star;关注请点watch,如果发现我有写错误的,欢迎随时帮我指出来,谢谢!

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published