来自JavsScript Garden摘取

1.数字类型不能用作对象,因为javascript解析器会将点号(.)解析成浮点型(as a floating point literal),比如:2.toString();会导致语法从错误,解决方法:

2..toString();//the second point is correctly recognized

2 .toString();//note the space left to the dot

(2).toString();//2 is evalulated first

2.原生对象继承自Object.prototype并且没有任何属性定义.

3.移除一个对象属性的唯一方法是使用delete操作符:

var obj={baz:3};

delete obj.baz;

4.如果delete作为对象key时需加引号,因为这是js中的关键字,若不加,则在符合ECMAScript5规范的引擎中会爆出语法错误.

5.作用域与命名空间

js不支持块级作用域,只存在函数级作用域,同样所有东西都定义在一个全局空间。每次引用变量,js会向上遍历作用域直到找到该变量,如果直到全局空间还没有找到就会报错。

6.局部变量

局部变量的唯一来源就是作为函数参数的变量和在函数内用var声明的变量

7.var 语句和函数声明上移

bar();
var bar = function() {};
var someValue = 42;

test();
function test(data) {
    if (false) {
        goo = 1;

    } else {
        var goo = 2;
    }
    for(var i = 0; i < 100; i++) {
        var e = data[i];
    }
}

上面代码在执行前会做一次转化,js会将var语句和function声明语句上移到该作用域的顶部

// var statements got moved here
var bar, someValue; // default to ‘undefined‘

// the function declaration got moved up too
function test(data) {
    var goo, i, e; // missing block scope moves these here
    if (false) {
        goo = 1;

    } else {
        goo = 2;
    }
    for(i = 0; i < 100; i++) {
        e = data[i];
    }
}

bar(); // fails with a TypeError since bar is still ‘undefined‘
someValue = 42; // assignments are not affected by hoisting
bar = function() {};

test();

在第一部分代码中,尽管if语句似乎修改了全局变量goo,但实际上它是在修改局部变量。

8.函数中变量名解析order

1.先看当前作用域中是否用var声明的该变量,如有,使用它;

2.如果函数参数中有该变量,使用它;

3.如函数自身名称就叫该名字,使用它;

4.跳到外层作用域,继续按步骤1开始进行查找。

9.匿名函数被认为是表达式,所以为了能够被调用,首先要对表达式求值

( // evaluate the function inside the parentheses
function() {}
) // and return the function object
() // call the result of the evaluation

同样还其他实现方式,这样不仅可以防止命名空间的污染,同样可以达到模块化的效果

// A few other styles for directly invoking the
!function(){}()
+function(){}()
(function(){}());
// and so on...

10.构造器(Constructors)

1.任何通过new关键字调用的函数扮演着构造器的角色,在构造器中this引用代表着新创建的对象。新对象的原型(__proto__)指向作为构造器被调用的函数对象的原型(prototype),如果函数中没有显示调用return语句,则默认返回新创建的对象。

2.如果构造器器显示调用return语句,那么只能return一个对象出来

function Car() {
    return ‘ford‘;
}
new Car(); // a new object, not ‘ford‘

function Person() {
    this.someValue = 2;

    return {
        name: ‘Charles‘
    };
}
new Test(); // the returned object ({name:‘Charles‘}), not including someValue

3.如果new关键字省略将不会返回这个新创建的对象,这时函数中的this将会引用全局对象而不是新创建的对象

function Pirate() {
    this.hasEyePatch = true; // gets set on the global object!
}
var somePirate = Pirate(); // somePirate is undefined

11.arguments对象

1.arguments持有传进函数的所有参数,arguments对象不是一个数组,但有具有数组的特点,比如有length属性,但是没有继承Array.prototype而是对象Object。这是这样,arguments也就不能使用数组的方法如:push,pop,slice.不过我们可以使用for来做迭代或者将其转化换为一个数组以支持数组的方法。

var arr = Array.prototype.slice.call(arguments);//转换为数组,但是转换慢,在实际应用中不建议使用

2.arguments对象为自己的属性和传给函数的形式参数都建有getter和setter方法,因此改变形参值得同时也改变了关联在arguments对象上的属性值,反之,改变arguments对象的属性也会影响形参值。

function foo(a, b, c) {
    arguments[0] = 2;
    a; // 2

    b = 4;
    arguments[1]; // 4

    var d = c;
    d = 9;
    c; // 3
}
foo(1, 2, 3);

3.只有当arguments在函数内被声明或者作为参数传递进函数时arguments对象是不会被创建的。另外有一个例外的情况就是arguments.callee的使用,会降低性能。

function foo() {
    arguments.callee; // do something with this function object
    arguments.callee.caller; // and the calling function object
}

function bigLoop() {
    for(var i = 0; i < 100000; i++) {
        foo(); // Would normally be inlined...
    }
}

12.this引用

1.this引用由五种绑定方式:

1).绑定为全局对象:this;//the global scope

2).同样绑定全局对象:foo();//call a function,this refer the global scope

3).绑定对象:test.foo()//calling a method,this refer to test

4).绑定新建对象:new foo()//calling a constructor

5).当显式调用Function.prototype的call或者apply时,this被设置为关联调用对象的被调用对象

function foo(a, b, c) {}

var bar = {};
foo.apply(bar, [1, 2, 3]); // array will expand to the below
foo.call(bar, 1, 2, 3); // results in a = 1, b = 2, c = 3

2.看下面代码:

Foo.method = function() {
    function test() {
        // this is set to the global object
    }
    test();
}

一个比较想当然的观念就是test中的this是引用Foo,实际上是错误的,而是引用global对象,如果要引用Foo对象,可以这样:

Foo.method = function() {
    var self = this;
    function test() {
        // Use self instead of this here
    }
    test();
}

在ECMAScript 5中,可以使用bind达到同样的效果:

Foo.method = function() {
    var test = function() {
        // this now refers to Foo
    }.bind(this);
    test();
}

3.当将一个方法赋值给一个对象时,就相当与一个简单的函数调用,比如下面代码,this将不再引用someObject对象

var test = someObject.methodTest;
test();

4.this的这种晚绑定正是使得原型继承工作的原因:

function Foo() {}
Foo.prototype.method = function() {};

function Bar() {}
Bar.prototype = Foo.prototype;

new Bar().method();

13.命名函数表达式

命名函数的赋值,代码中,bar在外层作用域是无效的,由于函数仅仅赋值给了foo,然而,在bar的内部是有效的,在前面作用域和命名空间提到:函数名在它的局部作用域内是有效的。

var foo = function bar() {
    bar(); // Works
}
bar(); // ReferenceError

14.for in 循环

当用于迭代一个对象的属性时,会遍历原型链,有时我们需要过滤出函数自身的属性,我们可以使用Object.prototype的hasOwnProperty(在EMAScript3或者更早的版本).

// Poisoning Object.prototype
Object.prototype.bar = 1;

var foo = {moo: 2};
for(var i in foo) {
    console.log(i); // prints both bar and moo
}
//----------------------------------------------我是分割线----------------------------
// still the foo from above
for(var i in foo) {
    if (foo.hasOwnProperty(i)) {
        console.log(i);
    }
}

15.hasOwnProperty

用于检测某个属性是来自函数自身而不是原型链的其他地方。如果对象中存在这样一个同名的属性,所以有必要扩展hasOwnProperty。

var foo = {
    hasOwnProperty: function() {
        return false;
    },
    bar: ‘Here be dragons‘
};

foo.hasOwnProperty(‘bar‘); // always returns false

// Use another Object‘s hasOwnProperty and call it with ‘this‘ set to foo
({}).hasOwnProperty.call(foo, ‘bar‘); // true

// It‘s also possible to use hasOwnProperty from the Object
// prototype for this purpose
Object.prototype.hasOwnProperty.call(foo, ‘bar‘); // true

16.Prototype:原生类型赋值给prototype时会被忽略。

function Foo() {}
Foo.prototype = 1; // no effect
时间: 2024-12-10 08:23:02

来自JavsScript Garden摘取的相关文章

【JavsScript】父子页面之间跨域通信的方法

由于同源策略的限制,JavaScript跨域的问题,一直是一个比较棘手的问题,为了解决页面之间的跨域通信,大家煞费苦心,研究了各种跨域方案.之前也有小网同学分享过一篇“跨域,不再纠结” 开始照着尝试时还是有些不够明白的地方,深入了解之后,这里给大家补充一点更具体的做法. 先来看看哪些情况下才存在跨域的问题: 其中编号6.7两种情况同属于主域名相同的情况,可以设置domain来解决问题,今天就不讨论这种情况了. 对于其他跨域通信的问题,我想又可以分成两类: 其一(第一种情况)是a.com下面的a.

【JavsScript】JavaScript MVC 框架技术选型

你很喜欢Gmail和Trello之类的单页面应用,但是不太确定该从何开始.也许你的JavaScript代码是如此的杂乱无章,以致于你很想在下一个项目上尝试下JavaScript MVC库和框架,却苦于没有头绪?我正在撰写一本单页面应用的书,所以我阅读了大量网上的相关资料.在这里我尝试提供一些看法,希望可以帮助你下决定. 简介 这里讨论的是时下最热的框架,AngularJS.Backbone.Ember和Knockout.同时提到了Batman.CANjs.Meteor和Spine,但是没有详细展

来自*****一个******

今天 从 一个 上看到的 很有感觉 =-= 摘取了部分 明天 或 今晚 开始看高数 可能 也又要开始算法了   缓了好多天了 ---------------------------------------------- 亲爱的堂弟. 我今天点进你的微博,发现你竟然已经悲伤逆流成河. 我掐指一算,你这年纪明显还在过儿童节.遥想当年我这个年纪的时候,我是每天疯疯癫癫地跑在草丛中,草丛中,和草丛中.那时我是那么快乐. 看了一下内容,发现你失恋了.至于你这个年纪能恋爱我已经倍感惊叹,恋爱了还能失恋我简直

Javascript推导Y-Combinator (来自Jim Weirich)

熟悉函数式编程的同学都了解lambda表达式,程序设计语言里的lambda表达式来源于1936年邱奇发明的lambda演算.Y-Combinator正是lambda演算里最富有神秘色彩的一种函数.它的作用是在只有匿名函数的lambda演算里实现递归函数调用.推导Y-Combinator很多人都做过了,比如这篇Javascript推导 Deriving the Y Combinator in 7 Easy Steps(中文) 还有这篇原文使用Scheme中文翻译为Javascript的推导 The

Web Farm和Web Garden的区别

在这篇博文中,我将确切剖析Web Farm和Web Garden的区别和原理,以及使用它们的利弊.进一步地,我将介绍如何在各个版本的IIS中创建Web Garden. 英文原文 | Abhijit Jana | 2010年10月2日 概述 ASP.NET开发服务器负责处理所有来自客户端的请求和响应(开发阶段).完成开发后,为了让他人可以访问你的站点,你必须将站点部署到服务器上,这将涉及到Web服务器.Web服务器负责处理所有来自客户端的请求,并给予响应.下图展示了ASP.NET Web应用程序典

RDVECore来自锐动的无UI,高度抽象化API的视频编辑SDK--IOS版

1 编写目的 预期读者: 有视频编辑开发经验或者无经验的,打算或者正在使用"锐动IOS版RDVECore"的相关工程师. iOS软件工程师. 产品经理. QA 2 名词解释 分辨率:用于计算机视频处理的图像,以水平和垂直方向上所能显示的像素数来表示分辨率.常见视频分辨率的有1080P即1920x1080,720P即1080x720,640x480等. 帧率:每秒的帧数(fps)或者说帧率表示图形处理器处理场时每秒钟能够更新的次数. 码率: 数据传输时单位时间传送的数据位数,一般我们用的

历史上的今天 API (数据来自维基百科)

历史上的今天 API (数据来自维基百科) API地址: http://history.lifetime.photo:81/api/history 参考/引用地址: 维基百科:https://zh.wikipedia.org/zh-cn/%E5%8E%86%E5%8F%B2%E4%B8%8A%E7%9A%84%E4%BB%8A%E5%A4%A9 IPIP5:http://www.ipip5.com/today/api.php?type=json 说明: 由于之前写的一个自动脚本用到了"历史上的今

Reveal常用技巧(翻译来自Reveal官网blog)

翻译来自官网:http://revealapp.com/blog/reveal-common-tips-cn.html 以下基于Reveal 1.6. 用于快速上手的内置应用 刚刚下载Reveal,啥都还没配置呢,想先随便玩玩看,怎么办? 我们花了不少时间开发这个复杂程度类似与实际场景的Sample应用──Soundstagram(音频分享版的Instagram, ¯\_(ツ)_/¯),就是为了让大家能最快速地上手Reveal,尝试它的各种强大功能. 在 Help 菜单项中,点击 Inspect

利用ansible modules模块来自定义集群管理

前沿: 在一些个特定环境下,用ansible做集群管理还是很棒的,这两天看了他的模块,官方提供了很多,就算不够,你也可以自定义定制. 话说我挺喜欢他的modules模块的,够直接 !!! 我这里就说些常见的ansible的modules吧. 下面的ansible service一看大家就懂了,就是服务状态的管理模块 [[email protected] ~ ]$ ansible web -m service -a "name=nginx state=started" 10.150.14