《JavaScript高级程序设计》第三版
学习笔记666
这个作者很懒,什么都没留下…
展开
-
块级作用域
为什么需要块级作用域?ES5只有全局作用域没和函数作用域,没有块级作用域,这带来很多不合理的场景。第一种场景,内层变量可能覆盖外层变量:var tmp = new Date();function f(){ console.log(tmp); if(false){ var tmp = "hello"; }}f(); // undefined上面代码中,函数f执行后,输出结果为un转载 2016-12-09 08:54:53 · 2014 阅读 · 0 评论 -
ES2015数组拓展 - Array.of()
Array.of方法用于将一组值,转换为数组Array.of(3,11,8) // [3,11,8]Array.of(3) // [3]Array.of(3).length // 1这个方法的主要目的,是弥补数组构造函数Array()的不足。因为参数个数的不同,会导致Array()的行为差异。Array() // []Array(3) // [,,,]Array(3,11,8) // [3原创 2016-12-13 09:05:34 · 745 阅读 · 0 评论 -
ES2015数组扩展 - Array.from()
Array.from方法用于把两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括ES6新增的数据结构Set和Map)。下面是一个类似数组的对象,Array.from将它转为真正的数组let arrayLike = {"0":"a","1":"b","2":"c",length:3};// ES5的写法var arr1 = [].sl原创 2016-12-12 09:55:45 · 1778 阅读 · 0 评论 -
JS中超越现实的匿名函数
一般函数:function show1(name){ alert(name); //打印:zhangsan }show1("zhangsan");匿名函数:var show2 = function (name) { alert(name); //打印:张三 }show2("张三");上面2种定义函数的区别: 1.我们知道所有的function都会原创 2016-09-02 22:20:42 · 353 阅读 · 0 评论 -
js中对象的小清新理解02
第一种简单写法:me = { "name":"张三", "age":18, "showName":function(){ alert(this.name); }};// 直接调用me.showName(); //打印:张三第二种面向对象写法:function me(){ this.name = "张三"; this.age = 18原创 2016-07-06 21:50:27 · 803 阅读 · 0 评论 -
js中对象的小清新理解01
在js中,所有事物都是对象:字符串、数字、数组、日期等等 我们甚至还能 str = new Boolean(false);对于对象,每个对象都有相应的属性和方法 如 str = “hello”; alert(str.length); 这里的length就是String对象的长度属性同样的: str = new String(“helllo”); alert(str.length); 效果原创 2016-07-06 21:22:09 · 275 阅读 · 0 评论 -
外部引用js的两种手法
脚本可以写在外部 原因如下: 1.封装,把一些通用的功能封装在一个脚本文件中,以备下次使用 2.减轻服务器端压力 3.编码规范转载 2016-07-02 21:04:35 · 5996 阅读 · 0 评论 -
也许你会混淆window和document
window是什么? 1.浏览器打开的窗口(标签) 2.打开网页时,浏览器会为网页建立一个全局的window对象 3.我们可以这么认为:window是顶级对象(好比皇帝),包括document都属于window 4.在js中,可以用self来返回当前窗口的window引申一下: 1.假设一个网页里包含了1个或多个iframe,那么浏览器也会为每个iframe创建一个window对象。但它转载 2016-07-02 20:41:39 · 455 阅读 · 0 评论 -
JS中的对象联姻:call方法
<script type="text/javascript"> var me = function (){ this.money = 100; this.show = function(){ alert("我有"+this.money+"块"); } } var mm = function(){原创 2016-07-12 22:21:21 · 509 阅读 · 0 评论 -
其实你根本就懂闭包
需求: *比如我们通过js构建一个商品对象,初始化传入商品ID。 该对象里面有个方法,该方法假设要通过『有逼格』的计算才能获获取商品名称*1.<script type="text/javascript"> var product = function(id){ var prodID = id; this.prodName = "药品"; //这个属性外部可原创 2016-07-12 20:58:43 · 422 阅读 · 0 评论 -
js事件触发
click包含了(mousedown,mouseup)叫做MouseEvents; keydown,keypress,keyup之流叫做UIEvents; focus,load,scroll,submit之流叫做HtmlEvents。MutationEvents,突变事件,往往用于对DOM对象的事件监听。 DOMNodeRemoved:当Node被删除时 DOMAttrModified:元素原创 2016-07-10 21:28:52 · 613 阅读 · 0 评论 -
let命令
基本用法ES6新增了let命令,用来声明变量。它的用法类似var,但是所声明的变量,只在let命令所在的代码块内有效。{ let a = 10; var b = 9;}a // ReferenceError: a is not defined.b // 9上面的代码块里,分别用let和var声明了2个变量。然后在代码块之外调用这个2歌变量,结果let声明的变量报错,var声明的原创 2016-12-08 16:44:40 · 1393 阅读 · 0 评论 -
const命令
const声明一个只读的常量。一旦声明,常量的值就不能改变。const PI = 3.1415;PI // 3.1415PI = 3; // TypeError: Assignment to constant variable.上面的代码表明改变常量的值会报错。const声明的变量不得改变值,这意味着,const一旦声明变量,就必须立即初始化,不能留到以后赋值。const foo; // Synt原创 2016-12-09 09:11:49 · 455 阅读 · 0 评论 -
apply、call
apply、call在js中,call和apply都是为了改变某个函数运行时的上下文(context)而存在的,换句话说,就是为了改变函数体内部的this指向。 js的一大特点是,函数存在定义时上下文和运行时上下文以及上下文是可以改变的这样的概念。function fruits(){}fruits.prototype = { color:'red', say:function(){cons转载 2017-02-15 09:56:17 · 375 阅读 · 0 评论 -
Promise对象的含义和基本用法
1.Promise的含义Promise是异步编程的一种解决方案,比传统的解决方案(回调函数和事件)更合理更强大。所谓Promise,简单说就是一个容器,里面保存着某个未来才会结束的事件 (通常是一个异步操作)的结果。从语法上说,Promise是一个对象,从它可以获取异步操作的消息。Promise对象有以下2个特点: 1.对象的状态不受外界影响。Promise对象代表一个异步操作,有三种状态:Pen原创 2016-12-20 13:43:31 · 42673 阅读 · 5 评论 -
ES2015函数扩展 - 函数参数的默认值
基本用法在ES6之前,不能直接为函数的参数指定默认值,只能采用变通的方法function log(x, y){ y = y || 'world'; console.log(x, y);}log('Hello'); // Hello worldlog('hello', 'china'); // hello chinalog('hello', ''); // hello world这原创 2016-12-19 10:18:15 · 2096 阅读 · 0 评论 -
Generator 函数 - 基本概念
1.简介基本概念Generator函数是ES6提供的一种异步编程解决方案,语法行为与传统函数完全不同。 Generator函数有多种理解角度。从语法上,首先可以把它理解成,Generator函数一个状态机,封装了多个内部状态。 执行Generator函数会返回一个遍历器对象,也就是说,Generator函数除了状态机,还是一个遍历器对象生成函数。 形式上,Generator函数是一个普通函数,原创 2017-01-03 13:16:18 · 4674 阅读 · 0 评论 -
Promise.prototype.then()和Promise.prototype.catch()
Promise.prototype.then()Promise实例具有then方法,也就是说,then方法是定义在原型对象Promise.prototype上的。它的作用是为Promise实例添加状态改变时的回调函数。then方法返回的是一个新的Promise实例(注意,不是原来那个Promise实例)。因此可以采用链式写法,即then方法后面再调用另一个then方法。getJSON('/posts原创 2016-12-21 12:06:54 · 3558 阅读 · 0 评论 -
ES2015字符串的扩展
includes()、startsWith()、endsWith()传统上,JavaScript只有indexOf方法,可以用来确定一个字符串是否包含在另一个字符串中。 ES6又提供了三种新方法includes():返回布尔值,表示是否找到了参数字符串startsWith():返回布尔值,表示参数字符串是否在源字符串的头部endsWith():返回布尔值,表示参数字符串是否在源字符串的尾部va原创 2016-12-10 10:04:40 · 1469 阅读 · 0 评论 -
变量解构赋值的用途
变量解构赋值用途很多 1.交换变量的值[x,y] = [y,x];2.从函数返回多个值 函数只能返回一个值,如果要返回多个值,只能把它们放在数组或对象里返回。有了解构赋值,取出这些值就非常方便了。// 返回一个数组function f(){ return [1,2,3];}var [a,b,c] = f();// 返回一个对象function f(){ return {foo:1原创 2016-12-09 11:45:25 · 1746 阅读 · 0 评论 -
对象的解构赋值
解构不仅可以用于数组,还可以用于对象var {foo,bar} = {foo:"aaa",bar:"bbb"};foo // "aaa"bar // "bbb"对象的解构和数组有一个重要的不同。数组的元素是按此排序的,变量的取值由它的位置决定;而对象的属性没有次序,变量必须与属性同名,才能取到正确的值。var {bar,foo} = {foo:"aaa",bar:"bbb"};foo // "原创 2016-12-09 11:07:44 · 6276 阅读 · 0 评论 -
数组的解构赋值
基本用法ES6允许按照一定的模式,从数组和对象中提取值,对变量进行赋值,这被称之为解构(Destructuring)// 以前为变量赋值,只能直接指定值var a = 1;var b = 2;var c = 3;// ES6允许写成这样var [a,b,c] = [1,2,3];本质上,这种写法属于“模式匹配”,只要等号两边的模式相同,左边的变量就会被赋予对应的值。 下面是一些使用嵌套数组原创 2016-12-09 10:45:29 · 3492 阅读 · 0 评论 -
顶层对象、global对象
顶层对象顶层对象,在浏览器环境指的是window对象,在Node指是的global对象。ES5之前中,顶层对象的属性与全局变量是等价的。window.a = 1;a // 1a = 2;window.a // 2上面的代码中,顶层对象的属性赋值和全局变量的赋值,是同一件事。ES6规定,var命令和function命令声明的全局变量,依旧是顶层对象的属性;let命令、const命令、class命令原创 2016-12-09 10:09:25 · 2915 阅读 · 0 评论 -
js中的this和prototype
定义一张车票var ticket = function(){ //定义车票,还没有被卖出去 this.price = 170; //车票价格}直接alert(ticket.price)提示undefined,因为车票没有被卖出去(没有实例化)var zhangsan = new ticket(); //代表被卖出去了alert(zhangsan.price); //打印:170var l原创 2016-07-09 21:10:21 · 1049 阅读 · 0 评论 -
js中值引用和地址引用
js中任何事务都是对象。包括基本数据类型(undefined,boolean,number,string,null)。 对象只是拥有属性和方法的特殊数据类型。基本数据类型也是对象 var a = “hello”; var b = “hello”; 既然是对象,那么它默认拥有属性和方法 a.length 长度属性 a.toUpperCase() 把字符串a编程大写的方法a==b,因为是原创 2016-07-09 20:46:56 · 4817 阅读 · 1 评论 -
【js对象属性的getter和setter】
定义存取器属性最简单的方法是使用对象直接量语法的一种扩展写法: var o = { //普遍的数据属性 data_prop:value, //存取器属性都是成对定义的函数 get accessor_prop(){/*这里是函数体*/}, set accessor_prop(value){/*这里是函数体*/}, };原创 2015-12-02 17:02:39 · 445 阅读 · 0 评论 -
微博剩余字数输入统计
HTML代码 分享到微博 还能输入120字 CSS代码body{ background-color:#71C5F2}.share_weibo_wp{width:480px; padding:20px; background-color:#fff; margin-left:auto; margin-right:auto; margin-top:20转载 2015-10-02 22:35:13 · 982 阅读 · 0 评论 -
JS字符串的一些常用方法
//【String类型】 //1.返回给定位置的那个字符 var stringValue = "hello world"; alert(stringValue.charAt(1)); //"e" //如果你想得到是不是字符而是字符编码 var stringValue = "hello world"; alert(stringValue.charCodeAt(1)); //输出"原创 2015-06-13 16:58:18 · 560 阅读 · 0 评论 -
JS函数内部属性:arguments
//1.arguments是一个类数组对象,包含着传入函数中的所有参数。主要用途是保存函数参数,但这个对象还有一个名叫callee的属性 //该属性是一个指针,指向拥有这个arguments对象的函数。 //请看下面非常经典的阶乘函数 function fuctorial(num){ if(num<=1){ return 1; }else{ return num *fu原创 2015-06-12 15:44:11 · 1208 阅读 · 0 评论 -
JS中给数组对象排序
//JS中给数组对象排序 //假设有一个对象数组,我们想要根据某个对象属性对数组进行排序。而传递给数组sort()方法的比较函数要接收2个参数,即要比较的值。 //可是,我们需要一种方式指明按照哪个属性来排序。 //要解决这个问题,可以定义一个函数,它接收一个属性名,然后根据这个属性名来创建一个比较函数。 function createComprisonFunction(propert原创 2015-06-12 14:56:31 · 3195 阅读 · 1 评论 -
JS函数中的 apply() 和 call()
//【JS函数属性和方法】 //1.length属性,表示函数希望接收的参数的个数 function sayName(name){ alert(name); } function sum(num1,num2){ return num1 + num2; } alert(sayName.length); //1 alert(sum.length); //2 //原创 2015-06-12 16:15:35 · 418 阅读 · 0 评论 -
JS数组的常用方法总结
//【检测数组】 //1.对于一个网页,或者一个全局作用域而言,使用instaceof操作符 if(value instanceof Array){ //todo... } //2.如果网页中包含多个框架,那实际上存在2个以上不同的全局执行环境 //ECMAScipt5新增了 Array.isArray()方法,最终确定某个值到底是不是数组,而不管它在哪个全局执行环境中创建的原创 2015-06-04 16:54:57 · 437 阅读 · 0 评论 -
第四章 变量、作用域和内存问题
js变量可以用来保存2种类型的值:基本类型值和引用类型值。基本数据类型有5种:Undefined、Null、Boolean、Number和String。1.基本类型值在内存中占据固定大小的空间,因此被保存在栈内存中。2.从一个变量向另一个变量复制基本类型的值,会创建这个值的副本。3.引用类型的值是对象,保存在堆内存中。4.包含引用类型值的变量实际上包含的并不是对象本身,而是一个指向原创 2015-06-03 12:03:02 · 444 阅读 · 0 评论 -
JS垮浏览器取得页面视口的大小
//垮浏览器取得页面视口的大小 var pageWidth = window.innerWidth, pageHeight = window.innerHeigth; if(typeof pageWidth != "number"){ if(document.compactMode == "CSS1Compat"){ pageWidth = document.documentElem原创 2015-06-18 14:56:39 · 2769 阅读 · 0 评论 -
JS垮浏览器取得窗口左边和上边的位置
var leftPos = (typeof window.screenLeft == "number") ? window.screenLeft : window.screenX; var topPos = (typeof window.screenTop == "number") ? window.screenTop : window.screenY;原创 2015-06-18 14:43:22 · 990 阅读 · 0 评论 -
js对象属性 通过点(.) 和 方括号([]) 的不同之处
【JS对象属性的查询和设置】可以通过点(.) 或 方括号([]) 运算符来获取属性的值。运算符左侧应当是一个表达式,它返回一个对象。对于点(.)来说,右侧必须是一个以属性名称命名的简单标识符。对于方括号([])来说,方括号里必须是一个计算结果为字符串的表达式,这个字符串就是属性的名字: var author = book.author; //得到book的"author"属性原创 2015-12-02 16:16:03 · 5951 阅读 · 0 评论 -
js对象『属性特征』和『对象特征』
对象是可变的,我们通过引用而非值来操作对象。如果变量x是指向一个对象的引用,那么执行代码 var y = x; 变量y也是指向同一个对象的引用,而非这个对象的副本。通过变量y修改这个对象也会对变量x造成影响。对象最常见的用法是create、set、query、delete、test、enumerate 它的属性。属性包括名字和值。属性名可以是包含空字符串在内的任意字符串,但对象不能原创 2015-12-02 14:23:44 · 1452 阅读 · 0 评论 -
js类的继承
如何实现类的继承呢? 有如下2个构造函数:function PeopleClass(){ this.type = "人"; };PeopleClass.ptototype = { getType:function(){ alert("这是一个人"); }};function StudentClass(name,sex){ this.nam原创 2016-04-29 11:22:30 · 493 阅读 · 0 评论 -
js的静态类
1.什么是静态类? 下面的函数本身就可以当做静态类来用:var StaticClass = function(){};StaticClass.name = "StaticName";StaticClass.Sum = function(value1,value2){ return value1 + value 2;};alert(StaticClass.name); //[原创 2016-04-29 11:02:27 · 4251 阅读 · 0 评论 -
js中利用prototype给类添加方法
1.如何定义一个简单的类? 以下是一个没有任何属性和方法的类的定义:function MyClass(){};你可能会想,这不就是个简单的函数声明?没错,这个函数就是一个类的定义的实现。如何使用这个类呢?看下面的代码:var cls1 = new MyClass();这样,利用new就可以生成MyClass的一个实例了。所以在js中可以说函数就是类,类就是函数。2.给类增加属性和方法functio原创 2016-04-29 10:54:41 · 15572 阅读 · 0 评论