
JavaScript
文章平均质量分 87
exialym
fu萝卜
展开
-
ES6学习17(SIMD)
概述SIMD(发音/sim-dee/)是“Single Instruction/Multiple Data”的缩写,意为“单指令,多数据”。它是JavaScript操作CPU对应指令的接口,你可以看做这是一种不同的运算执行模式。与它相对的是SISD(“Single Instruction/Single Data”),即“单指令,单数据”。var a = [1, 2, 3, 4];var b = [原创 2016-10-20 15:35:52 · 642 阅读 · 0 评论 -
ES6学习18(二进制数组)
二进制数组(ArrayBuffer对象、TypedArray视图和DataView视图)是JavaScript操作二进制数据的一个接口。 这个接口的原始设计目的,与WebGL项目有关。所谓WebGL,就是指浏览器与显卡之间的通信接口,为了满足JavaScript与显卡之间大量的、实时的数据交换,它们之间的数据通信必须是二进制的,而不能是传统的文本格式。文本格式传递一个32位整数,两端的JavaSc原创 2016-10-21 13:36:21 · 1760 阅读 · 1 评论 -
ES6学习5(对象的拓展)
属性的简洁表示法ES6允许在对象之中,只写属性名,不写属性值。这时,属性值等于属性名所代表的变量。var foo = 'bar';var baz = {foo};baz // {foo: "bar"}// 等同于var baz = {foo: foo};function f(x, y) { return {x, y};}// 等同于function f(x, y)原创 2016-10-10 21:57:17 · 734 阅读 · 0 评论 -
ES6学习4(函数的拓展)
函数参数的默认值基本用法在ES6之前,不能直接为函数的参数指定默认值,于是只能使用变通的方法。在函数内部手动检测参数是否有值,不过这样的方法有时并不保险。 ES6允许直接写上默认值。function log(x, y = 'World') { console.log(x, y);}log('Hello') // Hello Worldlog('Hello', 'C原创 2016-10-09 15:34:52 · 942 阅读 · 0 评论 -
JS模块化
完全不封装时最开始的js是很简单的,它并不承担很复杂的功能,于是所有的变量和函数都写在全局作用域中(Global)。这样一开始没有什么问题,但是当JS的代码越来越多,后来慢慢出现插件或多个JS文件时就有问题了,变量和函数的名称很容易冲突。function foo(){ //...}function bar(){ //...}利用JS对象模拟命名空间利用原创 2016-07-20 13:39:03 · 514 阅读 · 0 评论 -
ES6学习1(let与const)
let命令基本用法let命令用来声明变量,它的用法类似于var,但是所声明的变量只在let命令所在的代码块内有效。{ let a = 10; var b = 1;}a // ReferenceError: a is not defined.b // 1for循环的计数器就很适合使用let,这样计数器的值在外面就无法访问到了。不存在变量提升let不原创 2016-06-06 22:55:16 · 435 阅读 · 0 评论 -
ES6学习3(各种类型的拓展)
字符串的拓展字符的Unicode表示法ES5中,Unicode必须是\uxxxx形式的,少与4位不行,多于四位必须拆成两个4位的来表示。在ES6中,将一个码点值放在大括号中可以自动解析。与双字节表示等价。console.log("\uD842\uDFB7");// "��"console.log("\u20BB7");//乱码console.log("\u{20BB7}");//正常解析con原创 2016-06-12 09:18:31 · 1092 阅读 · 0 评论 -
JS学习23(几个有用的API)
requestAnimationFrame()原创 2016-06-04 18:00:41 · 1276 阅读 · 0 评论 -
ES6学习2(变量的解构赋值)
ES6允许按照一定的模式,从数组和对象中提取值,并对变量进行赋值。这对于解析json数据和函数参数等操作是非常有帮助的。数组的解构赋值基本用法以前为变量赋值只能直接指定,现在可以这样:var [a, b, c] = [1, 2, 3];console.log(c); //3这里ES6从数组里取了对应位置的值赋给了对应位置的变量。 其实,只要等号两边的模式相同,就原创 2016-06-08 09:28:25 · 507 阅读 · 0 评论 -
ES6学习6(Symbol)
ES5的对象属性名都是字符串,这容易造成属性名的冲突。比如,你使用了一个他人提供的对象,但又想为这个对象添加新的方法(mixin模式),新方法的名字就有可能与现有方法产生冲突。ES6引入了一种新的原始数据类型Symbol,表示独一无二的值。它是JavaScript语言的第七种数据类型。对象的属性名现在可以有两种类型,一种是原来就有的字符串,另一种就是新增的Symbol类型。凡是属性名属于S原创 2016-10-11 23:28:11 · 672 阅读 · 0 评论 -
ES6学习7(Proxy&Reflect)
Proxy原创 2016-10-13 13:51:03 · 1455 阅读 · 0 评论 -
ES6学习8(Set&Map)
Setvar s = new Set();[2, 3, 5, 4, 5, 2, 2].map(x => s.add(x));for (let i of s) { console.log(i);}// 2 3 5 4Set函数可以接受一个数组(或类似数组的对象)作为参数,用来初始化。// 初始化var items = new Set([1, 2, 3, 4, 5, 5, 5, 5]);原创 2016-10-13 16:06:45 · 380 阅读 · 0 评论 -
ES6学习16(编程风格)
块级作用域let取代varES6提出了两个新的声明变量的命令:let和const。其中,let完全可以取代var,因为两者语义相同,而且let没有副作用。'use strict';if (true) { let x = 'hello x'; var y = 'hello y'}for (let i = 0; i < 10; i++) { console.log(i);}cons原创 2016-10-20 13:57:58 · 460 阅读 · 0 评论 -
ES6学习15(异步操作和Async函数)
异步编程对JavaScript语言太重要。Javascript语言的执行环境是“单线程”的,如果没有异步编程,根本没法用,非卡死不可。 ES6诞生以前,异步编程的方法,大概有下面四种。回调函数事件监听发布/订阅Promise 对象ES6将JavaScript异步编程带入了一个全新的阶段,ES7的Async函数更是提出了异步编程的终极解决方案。基本概念所谓”异步”,简原创 2016-10-19 21:34:01 · 4520 阅读 · 0 评论 -
ES6学习14(模块)
历史上,JavaScript一直没有模块(module)体系,无法将一个大程序拆分成互相依赖的小文件,再用简单的方法拼装起来。其他语言都有这项功能,比如Ruby的require、Python的import,甚至就连CSS都有@import,但是JavaScript任何这方面的支持都没有,这对开发大型的、复杂的项目形成了巨大障碍。 ES6模块的设计思想,是尽量的静态化,使得编译时就能确定模块的依赖原创 2016-10-18 23:21:35 · 589 阅读 · 0 评论 -
ES6学习13(修饰器)
类的修饰修饰器(Decorator)是一个函数,用来修改类的行为。这是ES7的一个提案,目前Babel转码器已经支持。修饰器对类的行为的改变,是代码编译时发生的,而不是在运行时。这意味着,修饰器能在编译阶段运行代码。function testable(target) { target.isTestable = true;}@testableclass MyTestable原创 2016-10-18 11:50:36 · 482 阅读 · 0 评论 -
ES6学习12(Class)
Class基本语法概述ES5的传统方法:function Point(x, y) { this.x = x; this.y = y;}Point.prototype.toString = function () { return '(' + this.x + ', ' + this.y + ')';};var p = new Point(1, 2);ES6中://定义类clas原创 2016-10-17 17:07:54 · 412 阅读 · 0 评论 -
ES6学习11(Promise)
Promise是异步编程的一种解决方案,比传统的解决方案——回调函数和事件——更合理和更强大。 Promise对象有以下两个特点:对象的状态不受外界影响。Promise对象代表一个异步操作,有三种状态:Pending(进行中)、Resolved(已完成,又称Fulfilled)和Rejected(已失败)。只有异步操作的结果可以决定当前是哪一种状态,任何其他操作都无法改变这个状态。一旦状态改变原创 2016-10-15 22:36:21 · 1171 阅读 · 0 评论 -
ES6学习10(Generator)
简介Generator函数是ES6提供的一种异步编程解决方案,语法行为与传统函数完全不同。 形式上,Generator函数是一个普通函数,但是有两个特征function关键字与函数名之间有一个星号函数体内部使用yield语句,定义不同的内部状态我们先来看一个例子:function* helloWorldGenerator() { for (var i = 5;原创 2016-10-14 22:48:46 · 825 阅读 · 0 评论 -
ES6学习9(Iterator&for...of)
IteratorJavaScript原有的表示“集合”的数据结构: Array、Object、Map、Set 用户还可以组合他们,定义自己的数据结构。这样就需要一种统一的接口机制,来处理所有不同的数据结构。 遍历器(Iterator)就是这样一种机制。它是一种接口,为各种不同的数据结构提供统一的访问机制。任何数据结构只要部署Iterator接口,就可以完成遍历操作(即依次处理该数据结构的原创 2016-10-13 23:02:04 · 350 阅读 · 0 评论 -
JS学习16(错误处理与调试)
错误处理try-catchtry{ //可能出错的代码 asdfjsald} catch(error){ alert("errrrror"); alert(error.message);}finally子句 finally子句一旦使用,其代码无论如何都会执行。 真的是无论如何都会执行,就算之前的try-catch中有return语句。function test原创 2016-05-21 22:30:46 · 456 阅读 · 0 评论 -
JS学习15(HTML5脚本编程)
HTML5不仅定义了新的HTML标记,也定义了很多新的JS API。跨文档消息传送原创 2016-05-21 19:41:38 · 571 阅读 · 0 评论 -
JS学习19(Ajax与Comet)
Ajax:Asynchronous JavaScript + XML的简写。 Ajax技术的核心是XMLHttpRequest对象(XHR),XHR为向服务器发送请求和解析服务器响应提供了流畅的接口。能够以异步方式从服务器取得信息,再通过DOM将新数据插入到页面中。XMLHttpRequest对象IE7+ Firefox Opera Chrome Safari原生支持XHR对象。var xhr原创 2016-05-28 21:48:57 · 6608 阅读 · 2 评论 -
JS学习12(事件)
事件流IE和Netscape开发团队提出了完全相反的两种事件流的概念,事件冒泡流和事件捕获流。事件冒泡事件由最具体的元素开始,逐级向上传播到较不具体的元素,最终到文档。事件捕获事件捕获从document开始,逐级向下,最后传到最具体的节点。DOM事件流DOM2级事件定义的事件流包含3个阶段:事件捕获阶段,处于目标阶段,事件冒泡阶段。 捕获阶段会从文档节点自原创 2016-05-15 23:28:52 · 8533 阅读 · 0 评论 -
JS学习9(DOM)
DOM,文档对象模型,是一个针对HTML和XML文档的一个API,它描绘了一个层次化的节点树。值得注意的是IE中的所有DOM对象都是使用COM对象实现的,这就造成了IE中的DOM对象与原生JS对象表现并不一致。节点层次文档节点是每个文档的根节点。在html文档中,文档节点只有一个子节点即html元素。这个元素我们称之为文档元素,每个文档只有一个文档元素,其他所有元素都包含在文档元素中。原创 2016-05-08 16:04:42 · 1132 阅读 · 0 评论 -
JS学习11(DOM2&DOM3)
DOM1级主要是在定义HTML和XML文档的低层结构。D2和D3则在这个结构的基础上引入了更多的交互能力。它们被分为了许多模块:DOM Level 2 Core:为1级核心添加了更多方法和属性DOM Level 2 Views:为文档定义了基于样式信息的不同视图DOM Level 2 Events:说明了如何使用事件与DOM文档交互DOM Level 2 Style:有关CSSDOM原创 2016-05-13 13:54:37 · 8514 阅读 · 0 评论 -
JS学习6(函数表达式)
定义函数的方法有两种:函数声明和函数表达式。函数声明使用函数声明时,函数声明会被提升至当前作用域最前面。//这样也不会报错sayHi();function sayHi(){ alert("Hi!");}但是这个特性也就造成了这样的使用是不可预测的:if(condition){ function sayHi(){ alert("H原创 2016-05-02 15:23:26 · 513 阅读 · 0 评论 -
JS学习3(变量、作用域和内存)
基本类型和引用类型的值在第二篇中提到的5种基本数据类型:Undefined、Null、Boolean、Number、String这5种基本类型的变量是按值访问的,操作也是操作保存在变量种的实际的值。而引用类型的值是保存在内存中的对象,JS是不允许直接访问内存中的位置的,在操作对象时操作的实际上是对象的引用。动态的属性对引用类型的值来说,我们可以为其添加属性和方法,改变和删除也可以。原创 2016-04-17 15:54:13 · 627 阅读 · 0 评论 -
JS学习5(面向对象)
在ES里把对象定义为无序属性的集合,其属性可以包含基本值,对象和函数。原创 2016-04-29 13:55:14 · 6083 阅读 · 2 评论 -
JS学习17(JSON)
JSON是JavaScript Object Notation,JavaScript对象表示法。这是一种数据格式,并不从属于JS,许多语言都有JSON的解析器和序列化器。语法JSON的语法可以表示以下3种类型的值:简单值:使用与JS相同的简单语法,可以表示字符串,数值,布尔值和null对象:复杂类型,可以理解为嵌套的JSON,是一组无序的键值对,其中的值可以是简单类型也可以是复原创 2016-05-23 23:05:28 · 458 阅读 · 0 评论 -
JS学习4(引用类型)
引用类型是一种数据结构,用于将数据和功能组织在一起。对象是某个特定引用类型的实例。新对象使用new操作符后面跟一个构造函数来创建,构造函数本身就是一个函数,只不过这个函数是出于创建新对象而定义的。var person = new Object();这里调用的构造函数是Object(),只为新对象定义了默认的属性和方法。Object类型这是ECMAScript中使用的最多的类原创 2016-04-21 16:20:05 · 4512 阅读 · 0 评论 -
JS学习7(BOM)
BOM是浏览器对象模型,它提供了很多用于访问浏览器的功能。window对象BOM的核心对象是window,它表示浏览器的一个实例。在浏览器中window既是JS访问浏览器窗口的一个接口,又是ES里规定的Global对象。也就是说在网页中定义的任何一个对象,变量和函数都以window作为其Global对象。全局作用域在全局作用域中声明的变量,函数都会变成window对象的属性原创 2016-05-06 09:39:16 · 1295 阅读 · 0 评论 -
JS学习20(高级技巧)
高级函数函数本质上是很简单且过程化的,但是由于JS天生的动态的特性,从使用方式上可以很复杂。安全的类型检测虽然JS中是有类型检测的,但是由于浏览器实现等它们并不完全可靠。比如typeof在Safari中对正则表达式也返回function。 instanceof在存在多个全局作用域时也会把同种却不同作用域中构造函数的实例识别为不同的实例:var isArray = value in原创 2016-05-30 17:10:11 · 6021 阅读 · 1 评论 -
JS学习22(最佳实践)
可维护性JS从完成小的网页特效和验证到现在要处理各种复杂的逻辑,页面中代码的数量也是成倍的增长。这就让编写可维护的代码变得越来越重要了。可维护代码的特点可理解性 直观性 可适应性 可拓展性 可调试性代码约定注释和缩进。 变量命名以名词开始,函数名命名以动词开始,返回布尔值的函数以is开头。松散耦合不同语言间的紧耦合 CSS,JS,HTML他们天生原创 2016-06-02 22:01:58 · 665 阅读 · 0 评论 -
JS学习21(离线应用与客户端储存)
Web应用与传统客户端最大的区别就是需要连接网络,没有网络整个应用就无法运行,这个一直是Web应用最大的痛点之一。 HTML5为了解决这个问题添加了对离线应用的支持。开发离线Web应用有几个关键点。确保应用知道设备是否能上网以便下一步执行正确的操作,然后应用还必须能访问一定的资源。最后必须有一块本地空间用于保存数据,无论是否能上网都能读写数据。离线检测为检测设备是离线还是在线,HTM原创 2016-06-01 23:16:27 · 5450 阅读 · 0 评论 -
JS学习2(基础知识)
语法标识符标识符是变量,函数,属性的名字。标识符规则,首先是区分大小写。第一个字符必须是一个字母,下划线或美元。其他字符可以是字母,下划线,美元和数字。原创 2016-04-13 15:18:08 · 3961 阅读 · 1 评论 -
JS学习14(Canvas)
canvas由Apple公司推出,现在大部分浏览器支持绘制2D图形,3D图形的绘制使用WebGL的3D上下文。基本用法首先最重要的就是要给canvas画布一个宽高。 要在画布上绘图需要取得绘图上下文,使用getContext()方法原创 2016-05-19 15:22:12 · 562 阅读 · 0 评论 -
JS学习10(DOM扩展)
选择符API这个API存在的主要目的就是让JS原生支持CSS查询。querySelector()这个方法接收一个CSS选择符,返回与该模式匹配的第一个元素或null。var body = document.querySelector("body");querySelectorAll()这个方法同样接收一个CSS选择符,以静态NodeList的形式返回所有匹配的元原创 2016-05-08 23:18:51 · 1897 阅读 · 0 评论 -
(转)DOM中的动态NodeList与静态NodeList
原文地址:http://blog.youkuaiyun.com/renfufei/article/details/41088521昨天,我在雅虎的同事 Scott Schiller (斯科特·席勒, 同时也是SoundManager创造者) 发Twitter询问为何getElementsByTagName(“a”) 在所有浏览器上都比 querySelectorAll(“a”) 要快好多倍。 有一个 专门的 J转载 2016-05-08 16:07:52 · 828 阅读 · 0 评论 -
JS学习13(表单脚本)
表单基础知识在HTML中,表单是使用form元素来表示的,JS中对应的是HTMLFormElement类型。它同样继承自HTMLElement,还有一些自己的方法:acceptCharset:服务器能处理的字符集action:接受请求的URLelements:表单中所有控件的集合(HTMLCollection)enctype:请求的编码类型length:表单中所有控件的数量me原创 2016-05-18 19:55:22 · 751 阅读 · 0 评论