DOM事件模型 在0级DOM事件模型中,它只是简单的执行你为它绑定的事件,比如你为某个元素添加了一个onclick事件,当事件触发时,它只是去调用我们绑定的那个方法,不再做其他的操作. 在2级DOM事件模型中,就比较复杂一些,它将不再是单纯的调用一下自身绑定的事件就完事了,它还拥有机会去处理它的祖先节点,在DOM2级事件模型中,它有一个事件传播过程,分为3个阶段,从"事件捕获"Document开始来到"目标节点"再从"目标节点"冒泡回Docume…

值 有时我很想知道javascript解析引擎是如何区分一个变量的值,比如下面这段代码. var x = 'javascript'; //javascript x = "hello"; // hello x = 555; //555 x = null; //null x = a; //a is not defined x = true; //true 对于数字是直接赋值的,因为它没有多样性,数字就是数字.但是对于值是英文的情况就很难区分了,因为在编程语言中,英文既可能是字符串,也可能是…

ECMAScript语言类型对应于使用ECMAScript语言的ECMAScript程序员直接操作的值.ECMAScript语言类型有以下几种Undefined,Null,Boolean,String,Symbol,Number和Object.ECMAScript语言值是以ECMAScript语言类型为特征的值. 如果你奇怪为什么这里没有写Function类型,并且把Null也当做一种类型,建议你看一下hax在知乎上的一个回答JavaScript 里 Function 也算一种基本类型? 简单说…

Array构造器 如果参数只有一个并且是Number类型,那么就是指定数组的长度,但不能是NaN,如果是多个会被当做参数列表. new Array(12) // (12) [undefined × 12] new Array('') // [""] new Array({}) // [Object] new Array([]) // [Array(0)] new Array(null) // [null] new Array(NaN) // Uncaught RangeError: I…

创建对象 Object构造器的参数如果为空或null.undefined将返回一个空的Object对象,如果为其他值则调用相应的构造器,如 new Object() // Object {} new Object(null) // Object {} new Object(undefined) // Object {} new Object(1) // Number {[[PrimitiveValue]]: 1} new Object("a") // String {0: "…

Array构造器 如果参数只有一个并且是Number类型,那么就是指定数组的长度,但不能是NaN,如果是多个会被当做参数列表. new Array(12) // (12) [undefined × 12] new Array('') // [""] new Array({}) // [Object] new Array([]) // [Array(0)] new Array(null) // [null] new Array(NaN) // Uncaught RangeError: I…

JavaScript的作用:操作HTML元素,响应用户的操作,处理数据: script标签的type或者language可以写也可以不写: script标签防止位置:head结束之前或者body结束之后: JS里面严格区分大小写!!! JS可以通过元素的ID获取html元素, document.getElementById("box").onclick = function(){ alert('Hello JavaScript') }; 在上例中 onclic是点击事件:functio…

javascript不是什么 如<把时间当作朋友>的作者所说,"有些时候,有些事物,从反面描述比从正面描述更为容易.如若先仔细说清楚这本书不是什么,之后,至于它究竟是什么,很可能就不言自明了." javascript它不是一门静态类型.静态编程的语言,也不是一门服务器语言,更没有像其他语言那样有那么多的api,也没有强制你一定要按照哪种规范去编写代码,它的继承也不是像其他语言那样通过extends来继承. 怎么证明它不是什么 要搞懂它不是什么,就得先知道什么是静态类型,什么…

javascript复习笔记--------------------------------------------1.概念2.面向对象思想3.作用认识4.引入方式5.执行顺序 变量 1)声明方式 x=10 用 var声明(可以省略) 2) 变量的命名规则 a.不能以数字开头 b.不能是系统中关键字 [如if switch var 等] c.区分大小写 d.不能以标点符号开头 注释:单行://多行:/* */ 消息框:1)alert()2)confirm()3)prompt() 变量的数据类型(…

很早以前就觉得switch很怪异,或者说一直没太理解它,它怪异就怪异在非要给每个语句加上break;不然后面的语句就算不符合条件还是会执行,比如以下这段代码 var num = 2; switch(num){ case 1: console.log(1); case 2: console.log(2); case 3: console.log(3); case 4: console.log(4); } 执行效果如下 明明只有2才符合条件,但3跟4也被执行了,然后查教程说要加上break,后来代码…

创建函数 通过构造器的方式来创建函数,最后一个参数为函数体其他为形参 new Function('a','b','alert(a)') /* function anonymous(a,b) { alert(a) } */ 由于函数体是通过字符串拼接的,因此我们可以用这个特性来实现代码的组合 function foo(){ var a = 10; console.log(a); } new Function('say',foo + 'foo();console.log(say)')('Hello…

isEqualNode() isEqualNode方法可以用来判断两个DOM节点是否相同,给我的第一感觉是没用,因为两个DOM的比较很容易让人想成是字符串的比较,心想直接用两个等号不就可以了吗,但马上感觉不对,因为DOM是对象!两个不同的对象是不可能相等的,比如这段 var obj = {}; var obj2 = {}; console.log(obj==obj2);//false 可以看到两个对象是不等的,就算是长得一模一样,那么DOM是不是对象呢?我们打印一下 <div id="di…

原文:http://www.cnblogs.com/yanhaijing/p/3685304.html 这是我所知道的最完整最简洁的JavaScript基础教程. 这篇文章带你尽快走进JavaScript的世界——前提是你有一些编程经验的话.本文试图描述这门语言的最小子集.我给这个子集起名叫做“JavaScript简易教程”,并推荐准备深入阅读细节和高级技巧之前的新手阅读.心急吃不了热豆腐.文章的最后提出如何进一步学习. 警告:下面是我所描述的规则集和最佳实践.我喜欢整洁清晰(例如,你可以随时通…

这是我所知道的最完整最简洁的JavaScript基础教程. 这篇文章带你尽快走进JavaScript的世界——前提是你有一些编程经验的话.本文试图描述这门语言的最小子集.我给这个子集起名叫做“JavaScript简易教程”,并推荐准备深入阅读细节和高级技巧之前的新手阅读.心急吃不了热豆腐.文章的最后提出如何进一步学习. 警告:下面是我所描述的规则集和最佳实践.我喜欢整洁清晰(例如,你可以随时通过下面的目录快速导航).规则是无懈可击的,但不可避免——每个人的理解不同. 目录 1. 本文约定 2.…

演进和使用的JavaScript是早在1995年开发的一种语言,真的是刚刚起步. 网景公司在1995年四月聘请Brendan Eich ,他被告知,他有10天时间创造并制作了一种将在Netscape的浏览器中运行,以原型为工作方式的编程语言.那时候,Web创新的步伐是激烈的,由于微软突然使互联网的焦点集中在它即将发布的Windows 95操作系统作为对新兴Netscape的浏览器和服务器产品的系统发布的回应. 当时网景得到如此多的来自微软的关注,因为网景考虑将Web浏览器和服务器作为一个分布式操…

一个热爱技术的菜鸟...用点滴的积累铸就明日的达人 正文 如果真的想学好一门语言,那么一定要了解它内存模型,本篇文章就带你走进JavaScript的内存模型,由于本人才疏学浅,若有什么表述有误的地方,欢迎各位看官能够指点一二,在此不胜感激... 在阅读这边文章之前,默认您已经掌握了JavaScript的基本概念.栈堆等基本数据结构以及计算机基本理论基础,如有了解欠缺,请移步相关博客后再阅读本文. 一.基本的数据类型的内存结构 首先粗略的介绍一下JavaScript中五种基本的数据类型Undefi…

一个热爱技术的菜鸟...用点滴的积累铸就明日的达人 正文 在上一篇文章中讲解了JavaScript内存模型,其中有提到执行上下文与变量对象的概念.对于JavaScript开发者来说,理解执行上下文与变量对象的基本理论知识,是理解闭包,原型链的关键所在(闭包与原型链会在接下来的文章中介绍).本篇文章就带你走进JavaScript的执行上下文与变量对象,由于本人才疏学浅,若有什么表述有误的地方,欢迎各位看官能够指点一二,在此不胜感激... 在阅读这边文章之前,默认您已经掌握了JavaScript的基…

前言 函数式编程在前端已经成为了一个非常热门的话题.在最近几年里,我们看到非常多的应用程序代码库里大量使用着函数式编程思想. 本文将略去那些晦涩难懂的概念介绍,重点展示在 JavaScript 中到底什么是函数式的代码.声明式与命令式代码的区别.以及常见的函数式模型都有哪些? 一.什么是函数式编程 函数式编程是一种编程范式,主要是利用函数把运算过程封装起来,通过组合各种函数来计算结果.函数式编程意味着你可以在更短的时间内编写具有更少错误的代码.举个简单的例子,假设我们要把字符串 function…

Ajax 和异步处理 调用 API 访问数据采用的 Ajax 方式,这是一个异步过程,异步过程最基本的处理方式是事件或回调,其实这两种处理方式实现原理差不多,都需要在调用异步过程的时候传入一个在异步过程结束的时候调用的接口.比如 jQuery Ajax 的 success 就是典型的回调参数.不过使用 jQuery 处理异步推荐使用 Promise 处理方式. Promise 处理方式也是通过注册回调函数来完成的.jQuery 的 Promise 和 ES6 的标准 Promise 有点不一样,…

js中语句末尾可以不加分号, 很多时候在做练习或写几个页面时,我都是不会加的.虽然知道加了会好一点.但就是觉得很敲一句就要多按一次分号键(;)来加分号,而不加也不怎么样,然后就不想加了. 也听说在对js压缩于,会自动给语句加分号. 只是呢,从没认真考虑过如果分号会给js带来错误?什么情况下会导致错误? ——看了<走进javascript——不起眼的基础,值和分号>http://www.cnblogs.com/pssp/p/5215417.html 一文,我决定都给我的js语句加上分号. 难道是…

对于前端开发者来说,JavaScript 的内存机制是一个不被经常提及的概念 ,因此很容易被忽视.特别是一些非计算机专业的同学,对内存机制可能没有非常清晰的认识,甚至有些同学根本就不知道 JavaScript 的内存机制是什么. 但是如果你想成为行业专家,并打造高性能前端应用,那么你就必须要搞清楚 JavaScript 的内存机制了. 其实,要搞清楚 JavaScript 的内存机制并不是一件很困难的事,在接下来的三篇文章(数据在内存中的存放.JavaScript 处理垃圾回收以及 V8 执行代…

这是我在公众号(高级前端进阶)看到的文章,现在做笔记 https://mp.weixin.qq.com/s/yK4DPKhkmkiroasWJMrJcw 阅读笔记 JS内存空间分为栈(stack).堆(heap).池(一般也会归类为栈中). 其中栈存放变量,堆存放复杂对象,池存放常量,所以也叫常量池. 昨天文章介绍了堆和栈,小结一下,[进阶1-3期]JavaScript深入之内存空间详细图解 基本类型:--> 栈内存(不包含闭包中的变量) 引用类型:--> 堆内存 今日补充一个知识点,就是闭包…

走进vue.js(一) vue.js作为目前最具前景的前端框架之一,既然如此,博主贯彻以往的作风,肯定要捣鼓一番,经过为期半个多月的研究,算是对vue有了深刻的理解与认识,下面分三个章节解开vue.js的神秘面纱.本文旨在帮助大家认识vue.js,了解vue.js的开发过程,并进一步讲解如何通过vue.js构建一个大中型的前端项目. vue.js的简介 如果现在给一个场景,新学期开学,在学习氛围浓重的教室中,老师点名说:坐在后排戴眼镜的那个男孩看你精神抖擞,似乎有很多话对老师说吧,做个简短的自我…

JavaScript中的this总是让人迷惑,应该是js众所周知的坑之一. 个人也觉得js中的this不是一个好的设计,由于this晚绑定的特性,它可以是全局对象,当前对象,或者…有人甚至因为坑大而不用this. 其实如果完全掌握了this的工作原理,自然就不会走进这些坑.来看下以下这些情况中的this分别会指向什么: 1.全局代码中的this alert(this);  //window 全局范围内的this将会指向全局对象,在浏览器中即使window. 2.作为单纯的函数调用 functio…

一.前言 前端技术的发展是如此之快,各种优秀技术.优秀框架的出现简直让人目不暇接,作为一名业界新秀,紧跟时代潮流,学习掌握新知识自然是不敢怠慢.当听到AngularJs这个名字并知道是google在维护它时,便一直在关注,看到其在国外已经十分火热,可是国内的使用情况却有不小的差距,参考文献/网络文章也很匮乏.朝思暮想良久,决定深入学习angular,并写系列博客,一方面作为自己学习路程上的记录,另一方面也给有兴趣的同学一些参考. 首先我自己是一名学习者,会以学习者的角度来整理我的行文思路,故该系…

#cnblogs_post_body p{ text-indent:2em!important; } 历时两年多,我的书终于付梓出版了.应各方面的要求,写软文一篇,隆重介绍一下此书对各位程序员的钱途有什么帮助及阅读顺序等疑问.作为国内第一本讲述前端框架构的书,它里面充斥着许多大家前所未闻的知识,这些知识有50%只见于github的issue,讲述各种隐秘的浏览器兼容性问题及各种神奇的修复方案,或者是某些危险但美丽的黑魔法,另外50%我深夜梦游般在外国某些大牛(不局限于英语,有日语,俄语,韩语等,…

三位一体的网页 结构层:由HTML或XHTML之类的标记语言负责创建: 表示层:由CSS负责完成: 行为层:负责内容应该如何响应事件这一问题.这是由JavaScript语言和DOM主宰的领域. 分离 使用(X)HTML去搭建文档的结构: 使用CSS去设置文档的呈现效果: 使用DOM脚本去实现文档的行为: 不过,在这三种技术之间存在着一些潜在的重叠区域:用DOM可以改变网页的结构,诸如createElement和appendChild之类的DOM方法允许你动态地创建和添加标记. 在CSS上也有这种…

在学习javascript中,如果在事件的使用上出现一些反差效果,不良效果,如鼠标的移入移出时,显示你所需要的内容, 但就是没有出现,然而你不断的检查代码,逐个代码查错,还在浏览器的调试工具中调试都没有发现错误,没有看到你所 想要的错误,那么这个时候你要判断一下是不是冒泡事件带来的不良效果了,不过在判断之前,你是不是要知道什么是冒泡事件呢? 接下来冒泡的解释: 冒泡就是从里的事件源一级一级向上触发直到window: 图: 事件源就是你所触发事件在位置的元素,而在这个元素触发了事件,如图你所触发的…

这里的主题是 this ,不扯远了.this 本身原本很简单,总是指向类的当前实例,this 不能赋值.这前提是说 this 不能脱离 类/对象 来说,也就是说 this 是面向对象语言里常见的一个关键字.说的极端点,如果你编写的 JS 采用函数式写法,而不是面向对象式,你所有的代码里 this 会少很多,甚至没有.记住这一点,当你使用 this 时,你应该是在使用对象/类 方式开发,否则 this 只是函数调用时的副作用. JavaScript中的this总是让人迷惑,应该是js众所周知的坑之…

ref:http://blog.jobbole.com/39305/ 来源:foocoder 详解JavaScript中的this JavaScript中的this总是让人迷惑,应该是js众所周知的坑之一. 个人也觉得js中的this不是一个好的设计,由于this晚绑定的特性,它可以是全局对象,当前对象,或者…有人甚至因为坑大而不用this. 其实如果完全掌握了this的工作原理,自然就不会走进这些坑.来看下以下这些情况中的this分别会指向什么: 1.全局代码中的this alert(this…