Javascript
arthur_deng
nothing
展开
-
JavaScript学习笔记十:方法
JavaScript教程传送门绑定到对象上的函数称为方法,和普通函数也没啥区别:var xiaoming = { name: '小明', birth: 1990, age: function () { var y = new Date().getFullYear(); return y - this.birth; }};xiaomin原创 2016-06-24 10:09:29 · 246 阅读 · 0 评论 -
JavaScript学习笔记九:变量作用域
JavaScript教程传送门由于JavaScript的函数可以嵌套,此时,内部函数可以访问外部函数定义的变量,反过来则不行:'use strict';function foo() { var x = 1; function bar() { var y = x + 1; // bar可以访问foo的变量x! } var z = y + 1; // Re原创 2016-06-16 12:07:12 · 334 阅读 · 0 评论 -
JavaScript学习笔记二十:标准对象-JSON
JavaScript教程传送门JSON实际上是JavaScript的一个子集。在JSON中,一共就这么几种数据类型:number:和JavaScript的number完全一致;boolean:就是JavaScript的true或false;string:就是JavaScript的string;null:就是JavaScript的null;array:就是JavaScript的Array表示原创 2016-07-15 09:54:49 · 303 阅读 · 0 评论 -
JavaScript学习笔记十五:箭头函数
JavaScript教程传送门ES6标准新增了一种新的函数:Arrow Function(箭头函数)。x => x * x //它的定义用的就是一个箭头//等同于这个函数function (x) { return x * x;}箭头函数相当于匿名函数,并且简化了函数定义。上面定义的箭头函数只包含了一个表达式,它省略了{ ... }和return,若是函数包含多条语句时,则不能省略:x =原创 2016-07-06 09:10:46 · 415 阅读 · 0 评论 -
JavaScript学习笔记十六:generator
JavaScript教程传送门generator(生成器)是ES6标准引入的新的数据类型。一个generator看上去像一个函数,但可以返回多次。generator和函数不同的是,generator由function*定义(注意多出的*号),并且,除了return语句,还可以用yield返回多次:function* foo(x) { yield x + 1; yield x + 2;原创 2016-07-08 12:18:31 · 297 阅读 · 0 评论 -
JavaScript学习笔记十七:包装对象
JavaScript教程传送门在JavaScript的世界里,一切都是对象,但是对象中也会区分类型,number、string、boolean、function和undefined有别于其他类型。特别注意null的类型是object,Array的类型也是object,如果我们用typeof将无法区分出null、Array和通常意义上的object——{}。typeof 123; // 'number原创 2016-07-09 14:14:23 · 298 阅读 · 0 评论 -
JavaScript学习笔记二十一:创建对象
JavaScript教程传送门JavaScript对每个创建的对象都会设置一个原型,指向它的原型对象。当我们用obj.xxx访问一个对象的属性时,JavaScript引擎先在当前对象上查找该属性,如果没有找到,就到其原型对象上找,如果还没有找到,就一直上溯到Object.prototype对象,最后,如果还没有找到,就只能返回undefined。例如,创建一个Array对象:var arr = [1原创 2016-07-20 09:44:31 · 296 阅读 · 0 评论 -
JavaScript学习笔记二十二:class继承
JavaScript教程传送门新的关键字class从ES6开始正式被引入到JavaScript中。class的目的就是让定义类更简单。class Student { constructor(name) { this.name = name; } hello() { alert('Hello, ' + this.name + '!'); }原创 2016-07-20 09:54:37 · 257 阅读 · 0 评论 -
JavaScript学习笔记二十三:浏览器对象
JavaScript教程传送门windowwindow对象不但充当全局作用域,而且表示浏览器窗口。window对象有innerWidth和innerHeight属性,可以获取浏览器窗口的内部宽度和高度。内部宽高是指除去菜单栏、工具栏、边框等占位元素后,用于显示网页的净宽高。兼容性:IE<=8不支持。对应的,还有一个outerWidth和outerHeight属性,可以获取浏览器窗口的整个宽高。nav原创 2016-07-20 10:16:23 · 367 阅读 · 0 评论 -
JavaScript学习笔记二十四:操作DOM
JavaScript教程传送门由于HTML文档被浏览器解析后就是一棵DOM树,要改变HTML的结构,就需要通过JavaScript来操作DOM。查询DOM最常用的方法是document.getElementById()和document.getElementsByTagName(),以及CSS选择器document.getElementsByClassName()。// 返回ID为'test'的节点原创 2016-07-20 18:33:44 · 323 阅读 · 0 评论 -
JavaScript学习笔记二十五:操作表单
JavaScript教程传送门HTML表单的输入控件主要有以下几种:文本框,对应的,用于输入文本;密码框,对应的,用于输入密码;单选框,对应的,用于选择一项;复选框,对应的,用于选择多项;下拉框,对应的,用于选择一项;隐藏文本,对应的,用户不可见,但表单提交时会把隐藏文本发送到服务器。获取值获取text、password、hidden以及select的值:// <input type=原创 2016-07-21 09:58:41 · 287 阅读 · 0 评论 -
JavaScript学习笔记二十六:AJAX
JavaScript教程传送门function success(text) { var textarea = document.getElementById('test-response-text'); textarea.value = text;}function fail(code) { var textarea = document.getElementById('t原创 2016-07-21 16:08:14 · 631 阅读 · 0 评论 -
JavaScript学习笔记二十七:Promise
JavaScript教程传送门Promise是一个承诺将在未来返回值的对象。一个最简单的Promise例子:生成一个0-2之间的随机数,如果小于1,则等待一段时间后返回成功,否则返回失败:function test(resolve, reject) { var timeOut = Math.random() * 2; log('set timeout to: ' + timeOut原创 2016-07-22 08:50:49 · 354 阅读 · 0 评论 -
JavaScript学习笔记八:函数定义和调用
JavaScript教程传送门定义函数function abs(x) { if (x >= 0) { return x; } else { return -x; }}上述abs()函数的定义如下:function指出这是一个函数定义;abs是函数的名称;(x)括号内列出函数的参数,多个参数以,分隔;{ ... }之间的代码是函数体,可原创 2016-06-15 10:06:09 · 314 阅读 · 0 评论 -
JavaScript学习笔记十四:闭包
JavaScript教程传送门函数作为返回值高阶函数除了可以接受函数作为参数外,还可以把函数作为结果值返回。例如:一个返回求和函数的函数function lazy_sum(arr) { var sum = function () { return arr.reduce(function (x, y) { return x + y; })原创 2016-06-30 14:19:36 · 324 阅读 · 0 评论 -
JavaScript学习笔记十一:高阶函数-map/reduce
JavaScript教程传送门JavaScript的函数其实都指向某个变量。既然变量可以指向函数,函数的参数能接收变量,那么一个函数就可以接收另一个函数作为参数,这种函数就称之为高阶函数。map由于map()方法定义在JavaScript的Array中,比如我们有一个函数f(x)=x2,要把这个函数作用在一个数组[1, 2, 3, 4, 5, 6, 7, 8, 9]上,我们调用Array的map()原创 2016-06-25 16:44:41 · 2752 阅读 · 0 评论 -
JavaScript学习笔记二:字符串
由于多行字符串用\n写起来比较费事,所以最新的ES6标准新增了一种多行字符串的表示方法,用`多行字符串`(注意不是用引号,是反引号,键盘Tab键上面那个键)表示:`这是一个多行字符串`;要获取字符串某个指定位置的字符,使用类似Array的下标操作,索引号从0开始:var s = 'Hello, world!';s[0]; // 'H's[6]; // ' 's[7]; // 'w's[12原创 2016-06-04 16:46:43 · 335 阅读 · 0 评论 -
JavaScript学习笔记三:数组
JavaScript教程传送门如果通过索引赋值时,索引超过了范围,会引起Array大小的变化:var arr = [1, 2, 3];arr[5] = 'x';arr; // arr变为[1, 2, 3, undefined, undefined, 'x']大多数其他编程语言不允许直接改变数组的大小,越界访问索引会报错。然而,JavaScript的Array却不会有任何错误。在编写代码时,不建议原创 2016-06-04 17:00:31 · 281 阅读 · 0 评论 -
JavaScript学习笔记四:对象
JavaScript的对象是一种无序的集合数据类型,它由若干键值对组成。访问属性是通过.操作符完成的,但这要求属性名必须是一个有效的变量名。如果属性名包含特殊字符,就必须用单引号''括起来:var xiaoming = { name: '小明', 'high-school': 'No.1 High School'};xiaoming的属性名high-school不是一个有效的变量,原创 2016-06-06 15:45:36 · 288 阅读 · 0 评论 -
JavaScript学习笔记十二:高阶函数-filter
JavaScript教程传送门filter也是一个常用的操作,它用于把Array的某些元素过滤掉,然后返回剩下的元素。和map()类似,Array的filter()也接收一个函数。和map()不同的是,filter()把传入的函数依次作用于每个元素,然后根据返回值是true还是false决定保留还是丢弃该元素。例如,在一个Array中,删掉偶数,只保留奇数,可以这么写:var arr = [1, 2原创 2016-06-28 10:55:29 · 342 阅读 · 0 评论 -
JavaScript学习笔记一:数据类型和变量
JavaScript教程传送门NumberJavaScript不区分整数和浮点数,统一用Number表示,以下都是合法的Number类型:123; // 整数1230.456; // 浮点数0.4561.2345e3; // 科学计数法表示1.2345x1000,等同于1234.5-99; // 负数NaN; // NaN表示Not a Number,当无法计算结果时用NaN表示Infin原创 2016-06-03 13:27:56 · 315 阅读 · 0 评论 -
JavaScript学习笔记五:循环
JavaScript教程传送门for循环最常用的地方是利用索引来遍历数组:var arr = ['Apple', 'Google', 'Microsoft'];var i, x;for (i=0; i<arr.length; i++) { x = arr[i]; alert(x);}for循环的3个条件都是可以省略的,如果没有退出循环的判断条件,就必须使用break语句退出循环原创 2016-06-07 09:39:22 · 315 阅读 · 0 评论 -
JavaScript学习笔记六:Map和Set
JavaScript教程传送门JavaScript的默认对象表示方式{}可以视为其他语言中的Map或Dictionary的数据结构,即一组键值对。但是JavaScript的对象有个小问题,就是键必须是字符串。但实际上Number或者其他数据类型作为键也是非常合理的。为了解决这个问题,最新的ES6规范引入了新的数据类型Map。MapMap是一组键值对的结构,具有极快的查找速度。举个例子,假设要根据考试原创 2016-06-07 11:22:13 · 3962 阅读 · 0 评论 -
JavaScript学习笔记十三:高阶函数-sort
JavaScript教程传送门排序算法排序的核心是比较两个元素的大小,通常规定,对于两个元素x和y,如果认为x < y,则返回-1,如果认为x == y,则返回0,如果认为x > y,则返回1。JavaScript的Array的sort()方法就是用于排序的,但是排序结果可能让你大吃一惊:// 看上去正常的结果:['Google', 'Apple', 'Microsoft'].sort(); //原创 2016-06-29 09:09:48 · 364 阅读 · 0 评论 -
JavaScript学习笔记七:iterable
JavaScript教程传送门遍历Array可以采用下标循环,遍历Map和Set就无法使用下标。为了统一集合类型,ES6标准引入了新的iterable类型,Array、Map和Set都属于iterable类型。具有iterable类型的集合可以通过新的for ... of循环来遍历。for ... in循环由于历史遗留问题,它遍历的实际上是对象的属性名称。一个Array数组实际上也是一个对象,它的每原创 2016-06-13 15:40:50 · 558 阅读 · 0 评论 -
JavaScript学习笔记十八:标准对象-Date
JavaScript教程传送门在JavaScript中,Date对象用来表示日期和时间。var now = new Date();now; // Mon Jul 11 2016 13:33:10 GMT+0800 (CST)now.getFullYear(); // 2016, 年份now.getMonth(); // 6, 月份,注意月份范围是0~11,6表示七月now.getDate()原创 2016-07-11 13:49:18 · 284 阅读 · 0 评论 -
JavaScript学习笔记十九:标准对象-RegExp
JavaScript教程传送门在正则表达式中,如果直接给出字符,就是精确匹配。用\d可以匹配一个数字,\w可以匹配一个字母或数字,所以:'00\d'可以匹配'007',但无法匹配'00A';'\d\d\d'可以匹配'010';'\w\w'可以匹配'js';.可以匹配任意字符,所以:'js.'可以匹配'jsp'、'jss'、'js!'等等。要匹配变长的字符,在正则表达式中,用*表示任意个字原创 2016-07-11 16:58:45 · 327 阅读 · 0 评论 -
JavaScript学习笔记二十八:Canvas
JavaScript教程传送门Canvas是HTML5新增的组件,它就像一块幕布,可以用JavaScript在上面绘制各种图表、动画等。一个Canvas定义了一个指定尺寸的矩形框,在这个范围内我们可以随意绘制:<canvas id="test-canvas" width="300" height="200"></canvas>// CanvasRenderingContext2D对象var ctx原创 2016-07-22 09:12:03 · 341 阅读 · 0 评论