事件
事件一、EventTarget 接口 事件的本质是程序各个组成部分之间的一种通信方式,也是异步编程的一种实现。DOM 支持大量的事件,本章开始介绍 DOM 的事件编程。
1、概述DOM 的事件操作(监听和触发),都定义在EventTarget接口。所有节点对象都部署了这个接口,其他一些需要事件通信的浏览器内置对象(比如,XMLHttpRequest、AudioNode、AudioContext)也部署了这个接口。
该接口主要提供三个实例方法。
addEventListener:绑定事件的监听函数
removeEventListener:移除事件的监听函数
dispatchEvent:触发事件
2、EventTarget.addEventListener()EventTarget.addEventListener()用于在当前节点或对象上,定义一个特定事件的监听函数。一旦这个事件发生,就会执行监听函数。该方法没有返回值。
12target.addEventListener(type, listener[, useCapture]);// 事件名称,监听函数 [,是否在捕获阶段触发]
...
DOM
DOM一、概述1、DOMDOM 是 JavaScript 操作网页的接口,全称为“文档对象模型”(Document Object Model)。它的作用是将网页转为一个 JavaScript 对象,从而可以用脚本进行各种操作(比如增删内容)。
浏览器会根据 DOM 模型,将结构化文档(比如 HTML 和 XML)解析成一系列的节点,再由这些节点组成一个树状结构(DOM Tree)。所有的节点和最终的树状结构,都有规范的对外接口。
DOM 只是一个接口规范,可以用各种语言实现。所以严格地说,DOM 不是 JavaScript 语法的一部分,但是 DOM 操作是 JavaScript 最常见的任务,离开了 DOM,JavaScript 就无法控制网页。另一方面,JavaScript 也是最常用于 DOM 操作的语言。后面介绍的就是 JavaScript 对 DOM 标准的实现和用法。
2、节点DOM 的最小组成单位叫做节点(node)。文档的树形结构(DOM 树),就是由各种不同类型的节点组成。每个节点可以看作是文档树的一片叶子。
节点的类型有七种。
Document:整个文档树的顶层节 ...
异步操作
异步操作一、异步操作概述1、单线程模型单线程模型指的是,JavaScript 只在一个线程上运行。也就是说,JavaScript 同时只能执行一个任务,其他任务都必须在后面排队等待。
注意,JavaScript 只在一个线程上运行,不代表 JavaScript 引擎只有一个线程。事实上,JavaScript 引擎有多个线程,单个脚本只能在一个线程上运行(称为主线程),其他线程都是在后台配合。
JavaScript 之所以采用单线程,而不是多线程,跟历史有关系。JavaScript 从诞生起就是单线程,原因是不想让浏览器变得太复杂,因为多线程需要共享资源、且有可能修改彼此的运行结果,对于一种网页脚本语言来说,这就太复杂了。如果 JavaScript 同时有两个线程,一个线程在网页 DOM 节点上添加内容,另一个线程删除了这个节点,这时浏览器应该以哪个线程为准?是不是还要有锁机制?所以,为了避免复杂性,JavaScript 一开始就是单线程,这已经成了这门语言的核心特征,将来也不会改变。
这种模式的好处是实现起来比较简单,执行环境相对单纯;坏处是只要有一个任务耗时很长,后面的任务都必须排队 ...
面向对象
面向对象编程一、实例对象与new命令1、对象是什么面向对象编程(Object Oriented Programming,缩写为 OOP)是目前主流的编程范式。它将真实世界各种复杂的关系,抽象为一个个对象,然后由对象之间的分工与合作,完成对真实世界的模拟。
每一个对象都是功能中心,具有明确分工,可以完成接受信息、处理数据、发出信息等任务。对象可以复用,通过继承机制还可以定制。因此,面向对象编程具有灵活、代码可复用、高度模块化等特点,容易维护和开发,比起由一系列函数或指令组成的传统的过程式编程(procedural programming),更适合多人合作的大型软件项目。
那么,“对象”(object)到底是什么?我们从两个层次来理解。
(1)对象是单个实物的抽象。
一本书、一辆汽车、一个人都可以是对象,一个数据库、一张网页、一个与远程服务器的连接也可以是对象。当实物被抽象成对象,实物之间的关系就变成了对象之间的关系,从而就可以模拟现实情况,针对对象进行编程。
(2)对象是一个容器,封装了属性(property)和方法(method)。
属性是对象的状态,方法是对象的行为(完成某种任务)。 ...
事件循环 Event Loop
事件循环 Event LoopJS 的执行机制(同步任务、异步任务)JS 是一门单线程语言,单线程就意味着,所有的任务需要排队,前一个任务结束,才会执行下一个任务。这样所导致的问题是:如果 JS 执行的时间过长,这样就会造成页面的渲染不连贯,导致页面渲染加载阻塞的觉。为了解决这个问题,JS 中出现了同步和异步。
同步任务:即主线程上的任务,按照顺序由上⾄下依次执⾏,当前⼀个任务执⾏完毕后,才能执⾏下⼀个任务。
异步任务:不进⼊主线程,⽽是进⼊任务队列的任务,执行完毕之后会产生一个回调函数,并且通知主线程。当主线程上的任务执行完后,就会调取最早通知自己的回调函数,使其进入主线程中执行。
什么是 Event Loop
事件循环 Event Loop 又叫事件队列,两者是一个概念
事件循环指的是 js 代码所在运行环境(浏览器、nodejs)编译器的一种解析执行规则。事件循环不属于 js 代码本身的范畴,而是属于 js 编译器的范畴,在 js 中讨论事件循环是没有意义的。换句话说,js 代码可以理解为是一个人在公司中具体做的事情, 而 事件循环 相当于是公司的一种规章制度。 两者不是一个层 ...
JS内置对象
内置对象篇一、Object对象1、概述JavaScript 原生提供Object对象(注意起首的O是大写),本章介绍该对象原生的各种方法。
JavaScript 的所有其他对象都继承自Object对象,即那些对象都是Object的实例。
Object对象的原生方法分成两类:Object本身的方法与Object的实例方法。
(1)Object对象本身的方法
所谓“本身的方法”就是直接定义在Object对象的方法。
1Object.print = function (o) { console.log(o) };
上面代码中,print方法就是直接定义在Object对象上。
(2)Object的实例方法
所谓实例方法就是定义在Object原型对象Object.prototype上的方法。它可以被Object实例直接使用。
123456Object.prototype.print = function () { console.log(this);};var obj = new Object();obj.print() // Object
上面代码 ...
JS内置常用对象及方法
JavaScript 内置的常用对象有哪些?并列举该对象常用的方法?Number 数值对象,数值常用方法
Number.toFixed( ) 采用定点计数法格式化数字
Number.toString( ) 将—个数字转换成字符串
Number.valueOf( ) 返回原始数值
String 字符串对象,字符串常用方法
Length 获取字符串的长度
split()将一个字符串切割数组
concat() 连接字符串
indexOf()返回一个子字符串在原始字符串中的索引值。如果没有找到,则返回固定值 -1
lastIndexOf() 从后向前检索一个字符串
slice() 抽取一个子串
Boolean 布尔对象,布尔常用方法
Boolean.toString() 将布尔值转换成字符串
Boolean.valueOf() Boolean 对象的原始值的布尔值
Array 数组对象,数组常用方法
join() 将一个数组转成字符串。返回一个字符串
reverse() 将数组中各元素颠倒顺序
delete 运算符只能删除数组元素的值,而所占空间还在,总长度没变(arr.length ...
Git分支-变基
Git分支-变基在 Git 中整合来自不同分支的修改主要有两种方法:merge 以及 rebase。 在本节中我们将学习什么是“变基”,怎样使用“变基”,并将展示该操作的惊艳之处,以及指出在何种情况下你应避免使用它。
变基的基本操作
图0. 分叉的提交历史 ▲
之前介绍过,整合分支最容易的方法是 merge 命令。 它会把两个分支的最新快照(C3 和 C4)以及二者最近的共同祖先(C2)进行三方合并,合并的结果是生成一个新的快照(并提交)。
图1. 通过合并操作来整合分叉的历史 ▲
概念变基就是:将某一分支上的所有修改复制到另一分支上
除了merge,还有一种方法:你可以提取在 C4 中引入的补丁和修改,然后在 C3 的基础上应用一次。 在 Git 中,这种操作就叫做 变基(rebase)。 你可以使用 rebase 命令将提交到某一分支上的所有修改都移到另一分支上,就好像“重新播放”一样。
在这个例子中,你可以检出 experiment 分支,然后将它变基到 master 分支上:
1234$ git checkout experiment$ git rebase m ...
前端网站推荐
个人收藏夹推荐
panjiachen by 花裤衩
编程导航 by 程序员鱼皮
编程自学之路 by 程序羊
前端知识图谱+B站资源整合 by 技术胖
大圣编程自学网 by 大圣
开发者武器库
工具大全
::: center关注公众号[有趣研究社],回复前端资源,获取 前端学习资料:::
文档
MDN | MDN-JS标准内置对象 Web技术权威文档
DevDocs Web 开发技术文档,非常不错的学习手册!
现代JavaScript教程 以最新标准为基准的JS教程
ES5教程 阮一峰的JS教程
ES6教程 阮一峰的ES6教程
Bash 脚本教程 阮一峰编写
ECMA ECMA官网
菜鸟教程 涵盖多种语言的初级教程
腾讯云开发者手册
社区
Github 程序员同性交友社区
掘金 一个帮助开发者成长的社区
简书 有很多频道的创作社区
思否 解决技术问题的社区
stack overflow 同上,外网的
InfoQ 促进软件开发及相关领域知识与创新的传播
V2EX 创意工作者们的社区
鱼塘热榜 划水网站,收集了很多网站,当天热门文章
码力全开资源库 很全很强大,独立开发者/设 ...
Git变基合并
rebase分支合并说明以下 v2 是某个需求的开发分支, dev是总的开发分支,v2 是基于dev分支签出的。
当完成v2的开发后,需要把代码合并到dev,我们可以使用rebase进行合并:
12345678910111213141516171819202122232425262728# 首先将 v2 push到远程仓库git add .git commit -m 'xxx'git push origin v2# 切换到 dev 拉取最新代码git checkout devgit pull origin dev# 切换到 v2git checkout v2git rebase dev # 将 v2 的所有[commit] 变基到(应用到) dev# 切换到 devgit checkout devgit merge v2 # 将 dev分支 快进合并 (此时 (HEAD -> dev, v2) [commit] 两个分支指向同一个提交)# 查看 原v2的[commit]记录 是否在dev分支的最前面(变基成功会把v2的提交记录应用到dev分支的最前面)git ...