[笔记]Javascript中的11个难以理解的问题

2024-02-22 05:08

本文主要是介绍[笔记]Javascript中的11个难以理解的问题,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

看了这个人的javascript系列, 很受教育, 做了一些笔记.

http://www.cnblogs.com/fool/tag/%E7%90%86%E8%A7%A3Javascript/

  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中的11个难以理解的问题的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/734209

相关文章

解决IDEA报错:编码GBK的不可映射字符问题

《解决IDEA报错:编码GBK的不可映射字符问题》:本文主要介绍解决IDEA报错:编码GBK的不可映射字符问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录IDEA报错:编码GBK的不可映射字符终端软件问题描述原因分析解决方案方法1:将命令改为方法2:右下jav

Java 实用工具类Spring 的 AnnotationUtils详解

《Java实用工具类Spring的AnnotationUtils详解》Spring框架提供了一个强大的注解工具类org.springframework.core.annotation.Annot... 目录前言一、AnnotationUtils 的常用方法二、常见应用场景三、与 JDK 原生注解 API 的

Java controller接口出入参时间序列化转换操作方法(两种)

《Javacontroller接口出入参时间序列化转换操作方法(两种)》:本文主要介绍Javacontroller接口出入参时间序列化转换操作方法,本文给大家列举两种简单方法,感兴趣的朋友一起看... 目录方式一、使用注解方式二、统一配置场景:在controller编写的接口,在前后端交互过程中一般都会涉及

Java中的StringBuilder之如何高效构建字符串

《Java中的StringBuilder之如何高效构建字符串》本文将深入浅出地介绍StringBuilder的使用方法、性能优势以及相关字符串处理技术,结合代码示例帮助读者更好地理解和应用,希望对大家... 目录关键点什么是 StringBuilder?为什么需要 StringBuilder?如何使用 St

使用Java将各种数据写入Excel表格的操作示例

《使用Java将各种数据写入Excel表格的操作示例》在数据处理与管理领域,Excel凭借其强大的功能和广泛的应用,成为了数据存储与展示的重要工具,在Java开发过程中,常常需要将不同类型的数据,本文... 目录前言安装免费Java库1. 写入文本、或数值到 Excel单元格2. 写入数组到 Excel表格

Java并发编程之如何优雅关闭钩子Shutdown Hook

《Java并发编程之如何优雅关闭钩子ShutdownHook》这篇文章主要为大家详细介绍了Java如何实现优雅关闭钩子ShutdownHook,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起... 目录关闭钩子简介关闭钩子应用场景数据库连接实战演示使用关闭钩子的注意事项开源框架中的关闭钩子机制1.

Maven中引入 springboot 相关依赖的方式(最新推荐)

《Maven中引入springboot相关依赖的方式(最新推荐)》:本文主要介绍Maven中引入springboot相关依赖的方式(最新推荐),本文给大家介绍的非常详细,对大家的学习或工作具有... 目录Maven中引入 springboot 相关依赖的方式1. 不使用版本管理(不推荐)2、使用版本管理(推

Java 中的 @SneakyThrows 注解使用方法(简化异常处理的利与弊)

《Java中的@SneakyThrows注解使用方法(简化异常处理的利与弊)》为了简化异常处理,Lombok提供了一个强大的注解@SneakyThrows,本文将详细介绍@SneakyThro... 目录1. @SneakyThrows 简介 1.1 什么是 Lombok?2. @SneakyThrows

MyBatis模糊查询报错:ParserException: not supported.pos 问题解决

《MyBatis模糊查询报错:ParserException:notsupported.pos问题解决》本文主要介绍了MyBatis模糊查询报错:ParserException:notsuppo... 目录问题描述问题根源错误SQL解析逻辑深层原因分析三种解决方案方案一:使用CONCAT函数(推荐)方案二:

在 Spring Boot 中实现异常处理最佳实践

《在SpringBoot中实现异常处理最佳实践》本文介绍如何在SpringBoot中实现异常处理,涵盖核心概念、实现方法、与先前查询的集成、性能分析、常见问题和最佳实践,感兴趣的朋友一起看看吧... 目录一、Spring Boot 异常处理的背景与核心概念1.1 为什么需要异常处理?1.2 Spring B