web前端之js和jquery
文章平均质量分 78
做枚温婉的妹纸吧哈哈
这个作者很懒,什么都没留下…
展开
-
JS异步编程(promise、deferred对象)
本文主要是阅读了几篇文章之后整理出来的笔记。需要弄清楚的几个概念:首先要明白JS本身是单线程的,在处理一个任务的时候不可能去处理别的任务。也就是单凭JS是不可能异步编程的,必须借助一些别的机制。另外,浏览器是多线程的,例如HTTP请求线程、定时器线程、事件处理等…其次搞清回调函数是什么: 如果希望一个操作将来再执行,可以将其放到回调函数中,再在合适的时候触发回调函数。 回调函数原创 2016-11-03 11:15:29 · 11552 阅读 · 0 评论 -
JS高级程序设计(三):引用类型
Array的sort()方法是对数组元素应用toString()方法后比较字符串。因此,可以向sort传入一个比较函数作为参数,以确定比较的规则。indexOf和lastIndexOf方法在进行比价时使用的是===原创 2016-09-22 10:30:26 · 329 阅读 · 0 评论 -
E6箭头函数在哪些时候不适用
本文主要参考了When ‘not’ to use arrow functions以及箭头函数中this的用法先搞清楚this在箭头函数和普通函数中的区别:箭头函数的this值是在定义的时候就已经确定好了。而不是动态指定的。普通函数的this值是运行时确定的。 Arrow Function是 Lexical scoping, this指向定义Arrow Function时外围, 而不是运行时的对象。原创 2016-10-09 14:41:12 · 3143 阅读 · 0 评论 -
JS高级程序设计笔记(五):引用类型
Function函数名就是函数体的引用。可以将函数名作为参数传递给另一个函数,也可以在一个函数内部返回另一个函数,以便在函数体外调用。例如Array.prototype.sort接收一个函数作为参数,该参数规定了比较的规则,如果我们想对数组中的对象按照某个属性来进行排序,可以这样做:function compareByProperty(property) { return func原创 2016-10-09 10:54:39 · 432 阅读 · 0 评论 -
理解JavaScript中的原型
学习JavaScript有一段时间了,感觉原型那块儿又有点混乱了,现在写个笔记整理一下思路。什么是原型每创建一个函数,这个函数都会自带一个属性prototype指向一个原型对象,最初这个原型对象只包含一个属性constructor,这是指向我们创建的那个函数的指针。也就是说函数和原型对象分别通过prototype和constructor这两个属性(指针)能找到对方。我们可以通过fn...原创 2015-09-09 14:40:53 · 1153 阅读 · 0 评论 -
JS高级程序设计笔记(一)-数据类型
对未声明和未初始化的变量执行typeof都会返回undefined。不能给基本类型数据添加属性。变量应当尽量初始化,如果一个变量是用来保存对象的,如果还没有明确的对象,则应当初始化为null。parseInt和Number的区别:var str = "123true";parseInt(str); //123Number(str); //NaNvar str = "";pars原创 2016-09-13 14:23:02 · 427 阅读 · 0 评论 -
区别client、offset、scroll系列以及event的几个距离属性
element元素结点属性一. offset系列1.offsetWidth 和offsetHeightelement.offsetWidth是一个只读属性,它包括了: css width + padding+border+垂直滚动条宽度这里的滚动条就是单纯滚动条的意思,不包括不可见的部分哦。 而element.offsetHeight与之类似,只是改为垂直方向而已。 在页面布局中要计算和考原创 2015-07-28 20:42:22 · 4612 阅读 · 0 评论 -
HTML5之存储
1.什么是web app html5+css3+javascript,而不是java、object-cHTML提供的数据持久化–离线缓存技术数据持久化就是将数据保存在本地。1. Application cache也叫应用缓存,在本地缓存应用所需要的文件,只能缓存应用本身而非应用所需的数据。 开发者可以使用 Application Cache (AppCache) 接原创 2016-05-29 11:24:59 · 479 阅读 · 0 评论 -
JS DOM学习笔记
Array.prototype.slice()方法可将一个arguments对象转换为数组,也可将由结点的childNodes属性获取的类数组对象NodeList转换为数组:Array.prototype.slice.call(NodeList,0).结点属性:nodeType、nodeName、nodeValue;childNodes(返回一类数组对象,可通过下标访问其中的某个元素)、pare原创 2015-06-10 21:15:03 · 615 阅读 · 0 评论 -
理解回调函数
1.回调函数的作用域 回调函数作为参数传递给某个函数,因此回调函数和某个函数应该是处于平级的执行环境中的,它们的外层作用域链是相同的。回调函数可以用于同步和异步。 JavaScript始终是单线程的,处理这个就不能处理别的。ajax是异步的,那是因为浏览器又开了一个线程去请求,JavaScript主线程仍然是单线程的。 JavaScript引擎是单线程运行的,浏览器无论在什么时候都只且只有一原创 2016-10-11 14:36:52 · 372 阅读 · 0 评论 -
babel学习
.babelrc文件babel可以将ES6编写的代码转码成你所需要的编码格式。前提是要指定希望的转码方式,即指定要用的插件并安装(否则babel什么也不做,输出源码)。可以在.balbelrc 中进行指定:{ "presets": ["es2015"], "plugins": ["transform-es2015-modules-umd"]}presets 表示一组插件构成的集合,原创 2016-11-15 16:47:53 · 1696 阅读 · 0 评论 -
《高性能JS》学习笔记
脚本阻塞一些知识无论是对于内联的JS还是外部文件,页面的渲染和交互都会阻塞,等待JS的下载和执行。现在多数浏览器都能对多个JS文件进行并行下载,但是会阻塞其他类型资源的下载。必须等待JS完全下载并执行完后才能进行其他资源的下载。如果将内嵌脚本放到link样式文件之后,脚本为了在执行的时候获取精准的样式信息,会等待样式表下载完成,这样造成了页面阻塞。因此,不要把内嵌脚本放到link标原创 2017-04-27 18:26:01 · 463 阅读 · 0 评论 -
BOM学习
window对象window对象充当浏览器中的global对象。所有全局声明的变量和函数都自动归为window对象的属性和方法。但这样的属性不能通过delete 删除,除非显示地声明成window的属性:window.XXX此外,访问未声明的变量会报错,但是访问不存在的属性就不会,只会返回undefined ,因此,可通过window.xxx 来判断某个全局变量是否声明了。frame每一个框架都有自原创 2017-02-16 09:51:02 · 705 阅读 · 0 评论 -
JS高级程序设计笔记(六)- 函数
声明提升使用function 进行声明的函数具有声明提升的特性,因此可以在进行函数声明之前调用。但是通过var func = function(){} 这样的函数表达式声明的方法,则不可以。调用时会返回undefined。闭包首先来看看当调用一个函数时发生了什么。 当调用一个函数时,会创建一个执行环境和作用域链(作用域链赋值给执行环境内部的[scope]属性)。之后,this 、arguments原创 2017-02-23 09:56:47 · 466 阅读 · 0 评论 -
JavaScript的作用域和变量对象
变量对象先来说说什么是变量对象,变量对象中又存储了什么东西吧。 JavaScript中的执行环境包括全局执行环境和函数执行环境这两种,每进入到一个执行环境都会创建一个变量对象,这个对象中记录了在当前执行环境中可以访问到的变量,它们以变量对象的属性形式存在。也就是说这个变量对象成为“作用域”这个抽象概念的实体。 同时,变量对象中的属性记录是有一定先后顺序的,并且属性值到底是实际的值还是undefi原创 2015-07-04 10:46:35 · 1946 阅读 · 0 评论 -
JS高级程序设计笔记(二):变量、作用域和内存
JS中的参数传值都是按值来传递,如果是基本类型的值,则值会复制一份给命名参数/arguments对象;引用类型的值会把该值在内存中的地址复制一份给参数/arguments对象,因此该局部变量(函数的参数实际上是一个局部变量)的变化会反应在函数外部,即操作的是同一个对象。全局变量在使用完毕后最好进行引用解除,即obj = null。以便垃圾收集器在下次运行的时候回收内存。访问一个未声明的变量会报错原创 2016-09-14 15:10:19 · 409 阅读 · 0 评论 -
ajax与跨域
原生的ajax实现方式是通过XMLHttpRequest对象来实现的,该对象包含了一些方法来进行请求的发送、监听请求过程中的状态、接收响应内容等:var xhr = new XMLHttpRequest();xhr.onReadyStateChange = function() { if (xhr.readyState === 4) { //不使用this更靠谱 if(xh原创 2017-02-08 15:23:25 · 436 阅读 · 0 评论 -
JS高级程序设计笔记(四):类和继承
一些方法Person.prototype.isPrototypeOf(实例); //返回布尔值Object.getPrototypeOf(实例); //返回原型对象实例.hasOwnProperty(属性名) ;返回布尔值for in 和 in会访问实例和原型属性;for in只遍历可枚举属性Object.keys(o)返回可枚举实例属性名组成的数组,与for in中出现的顺序一致。...原创 2016-09-28 10:01:45 · 673 阅读 · 0 评论 -
JS权威指南学习笔记-浏览器中的JS
多个页面共享JS文件,实际上只会下载一次,其他的页面会从浏览器缓存中获取。脚本的执行默认是同步和阻塞的,当HTML解析器遇到script 标签时,必须先加载、执行完脚本后才会继续文档的解析和渲染。defer脚本的执行会阻塞页面的渲染,因此,在简单的开发中可以将脚本放到文档结束的位置,来避免空白的出现。然而defer属性为我们提供了另一种解决办法,它的意思是延迟脚本的执行,即便把脚本放在head 部分原创 2016-11-22 22:19:18 · 814 阅读 · 0 评论 -
《JS权威指南》学习笔记(五):数组
数组的读和写数组也是对象,因此通过[]访问数组元素,实际上就是通过属性名访问,[]中的会转换成字符串当做属性名来进行访问。如果[]中的是非负整数(以及和整数想相等的浮点数),则会动态改变数组元素的length属性;若不是非负整数,则会当做普通的属性名,且不会改变length值。稀疏数组指索引不连续的数组,其length值大于数组元素的个数。使用构造函数创建数组会生成稀疏数组:v原创 2016-05-05 20:48:10 · 452 阅读 · 0 评论 -
JS高级技巧笔记
使用Object.prototype.toString.call(value)区分数据类型使用typeof检测,只能区分基本类型的具体类型,而对于引用类型只能统一返回object。而使用Object.prototype.toString.call(value)能够确切返回基本、引用类型的数据的具体类型,只要这个数据的构造函数是原生而非自定义的。 官方文档中对这个方法的描述是: Whe原创 2016-05-29 11:27:35 · 419 阅读 · 0 评论 -
JavaScript中的this
通过这样的方式也可以把一个独立的函数的作用域变成一个对象:var person={ name:"anna"}function independent(){ alert(this.name);}person.func = independent;person.func();//anna原型链上的this替换为实例对象本身:var o={ f:funct原创 2016-05-29 11:22:00 · 359 阅读 · 0 评论 -
Ajax深入学习笔记
最近在学习ajax,下面整理了一下学习的内容,以便巩固用。 先来看看为什么要用ajax,也就是同步和异步是什么:同步和异步同步的意思就是客户端提交表单,发起请求后需要一直等待服务器端的响应,收到服务器端的响应后需要重新载入页面。 而有了ajax,则可进行异步交互,比如不会提交整个表单后等待服务器响应再刷新页面,而是填写的过程中,通过ajax的机制,就可以把已经填写的部分提交给服务器,服务器进行原创 2015-06-03 15:54:16 · 2835 阅读 · 1 评论 -
解除嵌套数组
对于一个像这样的嵌套数组:a=[1,[2,[3,4]],5,6]我们想要把它变成一个一维数组,有下面几种方法: 方法一 :递归function parseArr(arr,res){ var i=0; for(i=0;iarr.length;i++){ if(arr[i] instanceof Array){ parseArr(arr[i原创 2015-07-16 15:38:51 · 2937 阅读 · 0 评论 -
JQuery学习笔记
jquery对象和DOM对象两者是不同的概念,不可互相使用对方的方法。不过可以相互转换。jquery对象转换为DOM对象可使用[index],因为jquery对象是个类似数组的对象;或使用jQuery对象的get(index)方法获取DOM对象。 DOM对象转换为jQuery对象直接用“$()”将其包括起来。jQuery选择器基本选择器层次选择器 $(“pre + sibli原创 2015-06-09 19:42:36 · 515 阅读 · 0 评论 -
jquery事件学习
绑定事件1.bind参数: (eventType [, eventData ], handler(eventObject) ),eventType可以是自定义的事件,此时不能通过浏览器触发,可以通过trigger手动触发。此外,trigger()方法来了解如何在事件发生时向事件处理函数中传入参数,而不是在事件绑定的时候传递数据。2.unbind用于解除bind所绑定的事件,其中有一个用法:var原创 2015-07-14 15:35:33 · 473 阅读 · 0 评论 -
JS中的typeof
js中的typeof用来检查一个变量的数据类型,它返回的是一个字符串。不同类型变量经typeof运算符后返回的值如下:undefined:“undefined”null:“object”string:“string”number:“number”boolean:“Boolean”function:“function”object:“object”需要注意的是null返回的是原创 2015-06-20 10:10:03 · 2563 阅读 · 0 评论 -
JS学习笔记(w3school)
变 量1.声明了变量却未赋值,则该变量的值实际上是undefined2.如果重新声明了变量,其值还是之前的值,并不会丢失3.数据类型 数字、字符串、布尔值、数组、对象、null、undefined4.JavaScript区分大小写5.可用一个var声明或定义多个变量,用逗号隔开6.JavaScript中可用var声明变量直接使用,程序将其解释为一个全局变量;但原创 2015-05-30 14:36:00 · 1817 阅读 · 0 评论 -
JS 表单学习笔记
JS中表单对应HTMLFormElement类型,该类型有自己的一些属性和方法。获取某个表单最常用的方式有普通的getElementById(),还可通过document.forms[index/”表单name属性值”]来查询。1. 提交表单提交表单可通过提交按钮:input、button,type=”submit”,另外input还可定义图片为提交按钮,此时type=”image”。 点击提交按原创 2015-06-16 11:17:02 · 644 阅读 · 0 评论 -
用bind方法保持this上下文
最近自学JavaScript,学到bind方法这块儿有些地方不太明白,自己就查了些资料,结合自己的理解写了这篇文章以备后面回顾用。。。其实应该还是搬砖为主吧。什么是this对象先来说说什么是this对象吧,每个函数在调用的时候都会自动获取两个特殊变量:this和arguments对象。this值具体是指哪个对象是和该函数的执行环境相关的。如果是作为对象的方法,那么this就是对象实例本身;如果是一个原创 2015-08-27 10:51:39 · 7360 阅读 · 0 评论 -
javascript学习笔记(一)-廖雪峰教程
一. 基础1.for in,for of和forEach遍历的是对象的属性,由于数组也是对象,其内部的元素的索引就是其属性值,用该方式遍历数组就是获取了数组中的每一个元素的索引值(从0开始)。 而for of 则是直接遍历集合中的元素值本身。map、set和array都属于iterable类型的数据,都可以用for of来遍历:var oMap = new Map([['a原创 2015-08-18 16:26:39 · 3019 阅读 · 0 评论 -
《JS权威指南》学习笔记(四):对象
创建对象可以通过对象直接量或者构造函数来创建对象,此外ECMA 5还规定了一种方法 Object.create(),第一个参数为对象的原型,第二个可选参数用来对对象的属性进行进一步描述。 如果第一个参数传入null,则对象不继承任何东西,连最基础的例如toString()也没有,因此想创建一个普通空对象,可以传入参数Object.prototype。为了防止代码无意间修改不受控制的对象A,可原创 2016-04-19 19:54:57 · 577 阅读 · 0 评论 -
《JS权威指南》学习笔记(六):函数
定义函数的两种方式一是函数声明,实际上是声明了一个变量,该变量指向函数对象; 二是函数表达式,采用该方式函数的名称是可选的,通常没有函数名,但也可以有,例如:var f = function fact(x) { if (x 1) { return 1; } else { return x * fact(x-1); }}原创 2016-05-15 09:49:05 · 558 阅读 · 0 评论 -
《JS权威指南》学习笔记(三):表达式和运算符
evalJavaScript会解析并执行传入eval的字符串,eval使用了调用它的变量作用域环境。直接使用eval时,它总是在调用它的上下文作用域内执行; 通过别名间接调用则使用全局对象作为上下文作用域,无法读、写、定义局部变量和函数,这使得函数内部的变量不会受到影响。在严格模式下,eval执行的代码可以查询或更改局部变量,但不能在局部作用域中定义新的变量或函数。原创 2016-04-18 17:13:53 · 410 阅读 · 0 评论 -
《JS权威指南》学习笔记(二):语句
声明语句用var声明的全局变量作为全局对象的属性,但和其他全局属性不同的是不能通过delete删除。函数声明的两种方式:function声明: function func() {};使用表达式声明:var func = function() {};前者的func函数名是一个变量名,指向函数体。由于声明提升的作用,如果使用第一种方式,则在定义函数前进行函数调用不会报错;而后者由于初原创 2016-04-18 17:13:17 · 340 阅读 · 0 评论 -
《JS权威指南》学习笔记(一):类、值和变量
数字JavaScript中没有整数和浮点数之分,均为浮点数。NaN和任何数都不相等,包括自身。包括JavaScript在内的多数编程语言,采用二进制浮点数,能够精确表示1/2、1/1024等分数,但不能精确表示类似0.1等的数字。通常计算结果能够满足大多数要求,只是在判断==时可能会返回false。字符串字符串中的字符采用Unicode字符集,常用的Unicode字符由1原创 2016-04-16 15:33:51 · 728 阅读 · 0 评论 -
JavaScript中的跨域学习
什么是跨域来看看一个url地址: http://www.baidu.com:8080/scripts/jquery.js 它包含如下几个部分:协议:http子域名:www.主域名:baidu.com端口号:8080请求的资源:scripts/jquery.js当协议、子域名、主域名和端口号中任何一个不相同时都是不同域,不同域间相互请求资源称作跨域。跨域技术XHR对象通常只能访问与包含原创 2015-10-14 11:41:50 · 1358 阅读 · 0 评论 -
JS 事件学习笔记(一)
事件流如果说某个元素有祖先元素,其祖先元素和它都定义了相同的事件,那么在该元素上发生某个事件的时候,涉及到事件在该元素和祖先元素间的传递顺序问题。 分为两种: 事件冒泡:从最具体的元素开始接收,执行事件处理程序,然后把该事件往上传递一直到document对象。 如果在某个元素上触发了某个事件,则会调用其事件处理程序,若该元素没有定义事件处理程序或者事件返回true,则会交由父级对象处理,从里到原创 2015-09-07 15:04:55 · 995 阅读 · 0 评论 -
Json学习笔记
Json是一种轻量级的数据格式,使用了JavaScript语法的子集表示简单值(数字、字符串、布尔值)、null、对象(表示一组键值对)和数组,不支持变量、函数、对象实例。可将Json数据结构解析为JavaScript对象(而XML数据结构需要解析为DOM文档更麻烦)。也可将JavaScript对象转换为可随请求发送的数据(字符串,Ajax适合将纯文本内容发送给服务器)。即可方便地使对象和字符串自由原创 2015-09-09 15:49:45 · 617 阅读 · 0 评论 -
JS学习笔记(慕课网)
1. confirm(var or "str'); 点击确认,返回true;点击取消,返回false.2. prompt(str1,str2) str1显示在消息对话框中的文本,不可修改;str2文本框中的内容,可修改 点击确认,返回文本框中的内容即str2;点击取消,返回null3.window.open("url","打开方式","参数字符串")原创 2015-05-25 10:40:57 · 1094 阅读 · 0 评论