手写Promise
初始结构
我们在 New 一个 Promise
里的时候肯定是需要传入参数的,不然这个实例用处不大,而这个参数我们知道是一个函数,而且当我们传入这个函数参数的时候,这个函数参数会被自动执行。
因此我们需要在类的 constructor 里面添加一个参数,这里就用
func
来作为形参,并且执行一下这个参数,接下来需要为这个函数参数传入他自己的参数,也就是
resolve 和 reject,原生的 Promise 里面可以传入
resolve,reject
两个参数,那么我们也得允许手写这边可以传入这两个参数。
class Promise {
constructor(func) {
func(resolve,reject);
}
}
但是这样写明显有问题,因为手写这边不知道在哪里调用
resolve 和 reject 这两个参数,毕竟
resolve 和 reject
还没有定义。因此,就需要创造出这两个对象,有一点我们要知道的是,resolve、reject
也是以函数的形式来执行的 ...
关于npm和yarn
什么是 NPM
NPM(全称Node Package Manager,即node包管理器)
是Node.js默认的、以JavaScript编写的软件包管理系统
npm 来分享和使用代码已经成了前端的标配
官网: https://www.npmjs.com
npm被全球超过1100万开发人员所依赖
拥有超过一百万个软件包,是世界上最大的软件注册表
安装NPM
npm是Node.js默认的软件包管理系统
安装完毕node后,会默认安装好npm
npm本身也是基于Node.js开发的软件
下载Node: http://nodejs.cn
NPM 的使用
npm -v
#通过查看版本,看npm是否安装成功
npm install <Module Name>
#使用 npm 命令安装模块
npm install <Module Name> -g
#可以直接在命令行里使用
npm list -g
#查看所有全局安装的模块
npm list vue
#查看某个模块的版本号
npm -g insta ...
关于Git
版本控制
版本控制(Revision
control)是一种在开发的过程中用于管理我们对文件、目录或工程等内容的修改历史,方便查看更改历史记录,备份以便恢复以前的版本的软件工程技术。
实现跨区域多人协同开发
追踪和记载一个或者多个文件的历史记录
组织和保护你的源代码和文档
统计工作量
并行开发、提高开发效率
跟踪记录整个软件的开发过程
减轻开发人员的负担,节省时间,同时降低人为错误
简单说就是用于管理多人协同开发项目的技术。
没有进行版本控制或者版本控制本身缺乏正确的流程管理,在软件开发过程中将会引入很多问题,如软件代码的一致性、软件内容的冗余、软件过程的事物性、软件开发过程中的并发性、软件源代码的安全性,以及软件的整合等问题。
无论是工作还是学习,或者是自己做笔记,都经历过这样一个阶段!我们就迫切需要一个版本控制工具!
常见的版本控制工具
主流的版本控制器有如下这些:
Git
SVN(Subversion)
CVS(Concurrent Versions System)
VSS(Microsoft Visual S ...
关于 this 指向的理解
函数内 this 的指向
这些 this 的指向,是当我们调用函数的时候确定的。
调用方式的不同决定了this 的指向不同一般指向我们的调用者.
1. 普通函数 this 指向window
function fn() {
console.log('普通函数的this' + this);
}
window.fn();
2. 对象的方法 this指向的是对象
o
var o = {
sayHi: function() {
console.log('对象方法的this:' + this);
}
}
o.sayHi();
3.
构造函数 this 指向 ldh 这个实例对象 原型对象里面的this 指向的也是
ldh这个实例对象
function Star() {};
Star.prototype.sing = function() {
}
var ldh = new Star();
4.
绑定事件函数 this 指向的是函数 ...
关于 AJAX 的理解
原生AJAX
1.1 AJAX 简介
AJAX 全称为Asynchronous JavaScript And XML,就是异步的 JS 和 XML。
通过AJAX
可以在浏览器中向服务器发送异步请求,最大的优势:无刷新获取数据。 AJAX
不是新的编程语言,而是一种将现有的标准组合在一起使用的新方式。
1.2 XML 简介
XML 可扩展标记语言。 XML 被设计用来传输和存储数据。 XML 和 HTML
类似,不同的是 HTML 中都是预定义标签,而 XML 中没有预定义标签,
全都是自定义标签,用来表示一些数据。 比如说我有一个学生数据:
name = "孙悟空" ; age = 18 ; gender = "男" ;
用 XML 表示:
<student>
<name>孙悟空</name>
<age>18</age>
<gender>男</gender>
</student>
用 JSON 表示:
{"name":"孙悟空","age ...
jQuery 入门
jQuery 入门
jQuery 概述
JavaScript 库
JavaScript库:即
library,是一个封装好的特定的集合(方法和函数)。从封装一大堆函数的角度理解库,就是在这个库中,封装了很多预先定义好的函数在里面,比如动画animate、hide、show,比如获取元素等。
简单理解∶就是一个JS文件,里面对我们原生js代码进行了封装,存放到里面。这样我们可以快速高效的使用这些封装好的功能了。
比如jQuery,就是为了快速方便的操作DOM,里面基本都是函数(方法)。
常见的 JavaScript 库
jQuery
Prototype
YUI
Ext JS
移动端的 zepto
jQuery 的概念
jQuery 是一个快速、简洁的JavaScript库,其设计的宗旨是“write Less, Do
More”,即倡导写更少的代码,做更多的事情。
j 就是 JavaScript;Query查询;意思就是查询 js,把 js 中的DOM
操作做了封装,我们可以快速的查询使用里面的功能。
jQuery 封装了 Ja ...
PC&移动端网页特效
PC 端网页特效
元素偏移量 offset 系列
offset 概述
offset 翻译过来就是偏移量,我们使用 offset
系列相关属性可以动态的得到该元素的位置(偏移)、大小等
获得元素距离带有定位父元素得到位置
获得元素自身的大小(宽度高度)
注意:返回的数值都不带单位
常用属性
offsetTop
offsetLeft
以带有定位的父亲为准
offsetParent
返回带有定位的父亲,否则返回 body
offsetWidth
offsetHeight
元素可视区 client 系列
概述
client 翻译过来就是客户端,我们使用 client
系列的相关属性来获取元素可视区的相关信息。通过client系列的相关属性可以动态的得到该元素的边框大小、元素大小等。
元素滚动 scroll 系列
概述
scroll 翻译过来就是滚动的,我们使用 scroll
系列的相关属性可以动态的得到该元素的大小、滚动距离等
动画函数封装
动画实现原理
通过定时器 ...
关于高级事件和 BOM 浏览器对象类型
高级事件
注册事件
给元素添加事件成为注册事件或者绑定事件
传统方式和方法监听注册方式
传统注册
利用 on 开头的事件 onclick
<button onclick = alert("hi~")></button>
btn.onclick = function(){}
特点:注册事件的唯一性
同一元素同一事件只能设置一个处理函数,最后注册的处理函数将会覆盖前面注册的处理函数
方法监听注册方式
w3c 标准 推荐方式
addEventListener() 是一个方法
addEventListener(type, listener[, useCapture])
type 事件类型字符串,比如click mouseover
注意这里不要带on
listener 事件处理函数,事件发生时,会调用该监听函数
可选参数,是一个布尔值,默认是false
attachEvent 事件监听方式
ie9 之前的版本支持
生产版本一般不使用
IE9 之前的 IE 不支持此方法
同一 ...
关于 API 与 DOM 的理解
关于 API
API
Application Programming Interface,
应用程序编程接口,是一些预先定于的函数,目的是提供应用程序与开发人员基于某硬件或软件得以访问一组例程的能力,而又无需访问源码,或理解内部工作机制的细节。
API是给程序员提供的某种工具,以便能更轻松的实现想要完成的功能
WEB API
是浏览器提供的一套操作浏览器功能和页面元素的API(BOM和DOM),MDN API:
https://developer.mozilla.org/zh-CN/docs/Web/API
DOM
DOM 简介
什么是 DOM
文档对象模型(Document Object Model,简称
DOM),是W3C组织推荐的处理可拓展标记语言(HTML 或者
XML)的标准编程接口
DOM树
W3C已经定义了一系列的DOM接口,通过这些 DOM
可以改变网页的结构和样式
文档:一个页面就是一个文档,DOM中使用 document 表示
元素:页面中的所有标签都是元素,DOM中使用 element 表示
节点:网页中所有内容都是节点( ...
我的星座分析
你对自己的认知其实没别人说那么的感性,因为自己干很多事情都有目的性,所以你潜意识认为一切的感性都是建立在理性的基础之上的,但其实并没有这么简单,你潜意识里的理性,其实也是建立在更深的一层感性的基础上,也就是第三层,一般你对自己的了解只停留在第一层,也就是认为自己是一个超级感性的人。
比如,你见了一个很好看的人,非常心动,一会儿的时间就脑补了和他的一生,然后自己沉浸在自己的世界里感性,这是第一层的感性。
随后就开始在现实中去根据自己刚刚幻想完后的余温再去想要做什么,要让自己变成什么样来去达到自己之前幻想的一个目的,这个过程就是你对自己理性方面的认知,虽然自己会代入真感情到里面去,但有的你会以对自己的了解然后明确这是一份站在理性基础上的一份感性,也就是第二层。
而其实你如果认为自己很聪明的话,对自己的认知停留在第二层的话,其实就是容易会对除了自己有目的性的人以外的人,造成不好的印象,也就是你会针对自己的目的,明确的去让一个人走进他五彩缤纷的情感世界,而所用的方式,在其他人眼里是不喜欢的,也就是好多人说你作什么的,而一个有理性基础的人,如果感性的话,也多多少少会照顾一下其他人的想法 ...