文档章节

JS 特性汇总

 暴走的锅盖面
发布于 2016/03/17 14:48
字数 1198
阅读 48
收藏 0

1 预解析-Hoisting

■变量提升

变量提升,很简单,就是把变量提升提到函数的top的地方。我么需要说明的是,变量提升 只是提升变量的声明,并不会把赋值也提升上来

通常,各类文章和JavaScript相关的书籍都声称:“不管是使用var关键字(在全局上下文)还是不使用var关键字(在任何地方),都可以声明一个变量”。请记住,这是错误的概念:

任何时候,变量只能通过使用var关键字才能声明。

上面的赋值语句:

a = 10;

这仅仅是给全局对象创建了一个新属性(但它不是变量)。“不是变量”并不是说它不能被改变,而是指它不符合ECMAScript规范中的变量概念,所以它“不是变量”(它之所以能成为全局对象的属性,完全是因为VO(globalContext) === global,大家还记得这个吧?)。

■函数提升 

函数类型 提升可否 函数名有无 局部作用域使用与否
函数申明方式
YES 必须有 YES
函数表达式方式
NO 可有可无 YES
函数构造器方式
NO NO NO

   ◆函数申明方式(函数调用在函数申明之前,依然可以调用

function myTest(){ 
    foo(); 
    function foo(){ 
        alert("我来自 foo"); 
    } 
} 
myTest();

   ◆函数表达式方式(函数调用在函数表达式之前,不能调用.调用后⇒×TypeError foo is not a function

function myTest(){ 
    foo(); 
    var foo =function foo(){ 
        alert("我来自 foo"); 
    } 
} 
myTest();

   ◆函数构造器方式(不使用局部作用域

var y = "global"; 
function constructFunction() { 
var y = "local"; 
//Function()构造函数 
//不使用局部作用域
return new Function("return y;"); 
} 

function constFunction() { 
var y = "local"; 
//函数直接量 
var f = function () { 
//使用局部作用域 
return y;
}; 
return f; 
} 
//显示 global,因为Function()构造函数返回的函数并不使用局部作用域 
alert(constructFunction()()); 
//显示 lobal,因为函数直接量返回的函数并使用局部作用域 
alert(constFunction()());

■函数申明和变量申明的关系和影响

 function a(x) {
     x * 2;
  }
 var a;
 alert(a);

遇到同名的函数声明,VO不会重新定义,所以这时候全局的VO应该是如下这样的:

VO(global) = {
    a: 引用了函数声明“a”
}

而执行a的时候,相应地就弹出了函数a的内容了。


hasOwnProperty函数

hasOwnProperty是Object.prototype的一个方法,它可是个好东西,他能判断一个对象是否包含自定义属性而不是原型链上的属性,因为hasOwnProperty 是 JavaScript 中唯一一个处理属性但是不查找原型链的函数。

// 修改Object.prototype
Object.prototype.bar = 1; 
var foo = {goo: undefined};

foo.bar; // 1
'bar' in foo; // true

foo.hasOwnProperty('bar'); // false
foo.hasOwnProperty('goo'); // true

只有 hasOwnProperty 可以给出正确和期望的结果,这在遍历对象的属性时会很有用。 没有其它方法可以用来排除原型链上的属性,而不是定义在对象自身上的属性。

但有个恶心的地方是:JavaScript 不会保护 hasOwnProperty 被非法占用,因此如果一个对象碰巧存在这个属性,就需要使用外部的 hasOwnProperty 函数来获取正确的结果

var foo = {
    hasOwnProperty: function() {
        return false;
    },
    bar: 'Here be dragons'
};
foo.hasOwnProperty('bar'); // 总是返回 false

// 使用{}对象的 hasOwnProperty,并将其上下为设置为foo
{}.hasOwnProperty.call(foo, 'bar'); // true

当检查对象上某个属性是否存在时,hasOwnProperty 是唯一可用的方法。同时在使用 for in loop 遍历对象时,推荐总是使用 hasOwnProperty 方法,这将会避免原型对象扩展带来的干扰,我们来看一下例子:

// 修改 Object.prototype
Object.prototype.bar = 1;

var foo = {moo: 2};
for(var i in foo) {
    console.log(i); // 输出两个属性:bar 和 moo
}

我们没办法改变for in语句的行为,所以想过滤结果就只能使用hasOwnProperty 方法,代码如下:

// foo 变量是上例中的
for(var i in foo) {
    if (foo.hasOwnProperty(i)) {
        console.log(i);
    }
}

这个版本的代码是唯一正确的写法。由于我们使用了 hasOwnProperty,所以这次只输出 moo。如果不使用 hasOwnProperty,则这段代码在原生对象原型(比如 Object.prototype)被扩展时可能会出错。

总结:推荐使用 hasOwnProperty,不要对代码运行的环境做任何假设,不要假设原生对象是否已经被扩展了。

3 this

3.1在全局代码中,this始终是全局对象本身,这样就有可能间接的引用到它了。

3.2在通常的函数调用中,this是由激活上下文代码的调用者来提供的,即调用函数的父上下文(parent context )。this取决于调用函数的方式。

   以下是经典案例↓

foo() {
  alert(.bar);
}

x = {bar: 10};
y = {bar: 20};

x.test = foo;
y.test = foo;
 
x.test(); y.test();




© 著作权归作者所有

粉丝 0
博文 44
码字总数 30374
作品 0
浦东
高级程序员
私信 提问
深入了解React.js的JSX

JSX 是React 为JavaScript 语法带来的可选扩展,用于在JavaScript 代码中编写声明式XML 风格语法。 对于Web 项目而言,React 的JSX 提供了一组类似于HTML 的XML 标签,但在其他使用场景中,会...

紫霞等了至尊宝五百年
2018/06/01
0
0
好程序员Web前端培训入门之JS基础知识梳理汇总

好程序员Web前端入门之JS基础知识梳理汇总,Web前端工程师是当前各大企业都比较稀缺的人才,薪资待遇和就业前景都很不错。不论是专业还是非专业,有基础亦或是无基础,都想通过学习Web前端实...

好程序员IT
03/27
12
0
React.js 实战之 JSX 简介

在项目中引入并使用 JSX 这种看起来可能有些奇怪的标签语法既不是字符串也不是 HTML 它被称为 JSX, 一种 JavaScript 的语法扩展 推荐在 React 中使用 JSX 来描述用户界面 JSX 乍看起来可能比...

JavaEdge
2018/12/01
0
0
《Node.js开发指南》书评汇总

刚查了下库存,发现订阅《Node.js开发指南》的读者大增,这是为什么呢?看了下近期本书在豆瓣的评论,口碑很好,现将豆瓣的书评汇总如下: ----------------------------------------------...

生气的散人
2012/10/15
664
0
《Node.js开发指南》书评汇总

刚查了下库存,发现订阅《Node.js开发指南》的读者大增,这是为什么呢?看了下近期本书在豆瓣的评论,口碑很好,现将豆瓣的书评汇总如下: ----------------------------------------------...

生气的散人
2012/10/15
3.3K
3

没有更多内容

加载失败,请刷新页面

加载更多

哪些情况下适合使用云服务器?

我们一直在说云服务器价格适中,具备弹性扩展机制,适合部署中小规模的网站或应用。那么云服务器到底适用于哪些情况呢?如果您需要经常原始计算能力,那么使用独立服务器就能满足需求,因为他...

云漫网络Ruan
45分钟前
2
0
Kafka 2.3 Producer (0.9以后版本适用)

kafka0.9版本以后用java重新编写了producer,废除了原来scala编写的版本。 这里直接使用最新2.3版本,0.9以后的版本都适用。 注意引用的包为:org.apache.kafka.clients.producer import ja...

实时计算
54分钟前
2
0
Java 中的 String 有没有长度限制

转载: https://juejin.im/post/5d53653f5188257315539f9a String是Java中很重要的一个数据类型,除了基本数据类型以外,String是被使用的最广泛的了,但是,关于String,其实还是有很多东西...

低至一折起
今天
14
0
OpenStack 简介和几种安装方式总结

OpenStack :是一个由NASA和Rackspace合作研发并发起的,以Apache许可证授权的自由软件和开放源代码项目。项目目标是提供实施简单、可大规模扩展、丰富、标准统一的云计算管理平台。OpenSta...

小海bug
昨天
11
0
DDD(五)

1、引言 之前学习了解了DDD中实体这一概念,那么接下来需要了解的就是值对象、唯一标识。值对象,值就是数字1、2、3,字符串“1”,“2”,“3”,值时对象的特征,对象是一个事物的具体描述...

MrYuZixian
昨天
8
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部