解析Javascript中难以理解的11个问题
解析Javascript中难以理解的11个问题
发布时间:2016-12-30 来源:查字典编辑
摘要:1.原始值与引用值原始值存放在栈里,引用值存放在堆里.如程序:复制代码代码如下:functionPerson(id,name,age){th...

1.原始值与引用值

原始值存放在栈里, 引用值存放在堆里. 如程序:

复制代码 代码如下:

function Person(id,name,age){

this.id = id;

this.name = name;

this.age = age;

}

var num = 10;

var bol = true;

var str = "abc";

var obj = new Object();

var arr = ['a','b','c'];

var person = new Person(100,"笨蛋的座右铭",25);

2.undefined和null

undefined: 变量未定义; 是Undefined类型的专属值;

null:引用未分配;是Null类型的专属值.

typeof(undefined)== undefined;

typeof(null) == object;

undefined==null;

undefined!==null;

null instanceof Object == false;

undefined instanceof Object == false;

虽然有Undefined和Null类型,但是通过下面的例子说明这两个类型是不可见的,也就是说我们只能使用他们的值:

alert(undefined instanceof Undefined);

alert(null instanceof Null);

3.伪数组

特点:

1) 具有length属性;

2) 像数组一样按索引顺序存取数据;

3) 不具备数组特有的操作数据的方法如push, pop, slice...

伪数组都可以通过Array.prototype.slice转换为真正的数组:

var faceArray = {0: 'a', 1: 'b', length: 2}//标准的伪数组;

var realArray = Array.prototype.slice.call(fakeArray);

js中的伪数组:arguments,node.childNodes,document.getElementsByTagName()...

IE中的问题 : IE中node.childNodes是不能用slice转化的.

Jquery中的伪数组 : Jquery本身就是一个伪数组:

alert($('.class1').length); alert($('.class1').[0].tagName);

4.关于简单类型的字面量

var a = 1; b = true, c = "ccc";

字面量看起来有类型

alert(typeof a);//number

alert(typeof b);//boolean

alert(typeof c);//string

但是通过instanceof却测不出来

alert(a instanceof Number)//false

alert(a instanceof Object)//false

alert(b instanceof Boolean)//false

alert(b instanceof Object)//false

alert(c instanceof String)//false

alert(c instanceof Object)//false

5.函数的prototype属性和对象实例的内部prototype属性

每个function(构造函数)都有一个prototype属性, 每个对象实例都有一个不可见的(mozilla把它公开了, 可以通过__proto__来取得)内部的prototype属性, 它指向构造函数的prototype属性. prototype还可以有它自己的prototype属性, 这构成了prototype链, Object是最顶的对象, 所以所有的prototype链最终会指向Object.prototype. 当访问对象实例的属性/方法的时候, 从对象实例自己开始搜索, 若果搜索不到, 沿着prototype链向上搜索, 直到Object.prototype.prototype == null 为止.

6.构造函数的一个小秘密

复制代码 代码如下:

var s = new function(){return "sss"};

alert(s);//[object Object]

s = new function(){return new String("sss")};

alert(s);//sss

关于这段代码的解释:

只要 new 表达式之后的 constructor 返回(return)一个引用对象(数组,对象,函数等),都将覆盖new创建的匿名对象,如果返回(return)一个原始类型(无 return 时其实为 return 原始类型 undefined),那么就返回 new 创建的匿名对象.

7.对象的创建的过程

复制代码 代码如下:

function Person(name){

this.name = name;

}

Person.prototype = {

getName: function(){return this.name}

};

var p = new Person('zhangsan');

解密p的创建过程:

◦创建一个build-in object对象obj并初始化;

◦将p的内部[[Prototype]]指向Person.prototype;

◦将p作为this,使用arguments参数调用Person的内部[[Call]]方法, 即执行Person函数体, 并返回返回值, 如果没有return, 则返回undefined;

◦如果前一步返回的是Object类型, 则返回这个值给p, 否则返回obj.

8.对象的自有属性和继承属性

复制代码 代码如下:

function Person(name){

this.name = name;

}

Person.prototype = {

type: 'human',

getName: function(){return this.name}

};

var p = new Person('zhangsan');

alert(p.hasOwnProperty('type'));//false

p.type = 'ren';

alert(p.hasOwnProperty('type'));//true

运行结果很明确,对象的属性无法修改其原型中的同名属性,而只会自身创建一个同名属性并为其赋值。

9.函数对象的创建过程

创建一个build-in object对象fn;

将fn的内部[[Prototype]]设为Function.prototype;

设置内部的[[Call]]属性,它是内部实现的一个方法,处理函数调用的逻辑。(简单的理解为指向函数体);

设置fn.length为funArgs.length,如果函数没有参数,则将fn.length设置为0;

fn.prototype的constructor指向fn自己;

返回fn.

10.instanceof的原理

查看a是不是B的实例, 就是看B的prototype(构造函数的prototype属性)指向的对象在不在a的原形链上.

11.关于Function和Object的猜测

alert(Function instanceof Function);//true

alert(Function instanceof Object);//true

alert(Object instanceof Function);//true

alert(Object instanceof Object);//true

想了好久, 没有想透......

推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
相关阅读
网友关注
最新Javascript教程学习
热门Javascript教程学习
编程开发子分类