[笔记]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

相关文章

Spring Boot集成/输出/日志级别控制/持久化开发实践

《SpringBoot集成/输出/日志级别控制/持久化开发实践》SpringBoot默认集成Logback,支持灵活日志级别配置(INFO/DEBUG等),输出包含时间戳、级别、类名等信息,并可通过... 目录一、日志概述1.1、Spring Boot日志简介1.2、日志框架与默认配置1.3、日志的核心作用

破茧 JDBC:MyBatis 在 Spring Boot 中的轻量实践指南

《破茧JDBC:MyBatis在SpringBoot中的轻量实践指南》MyBatis是持久层框架,简化JDBC开发,通过接口+XML/注解实现数据访问,动态代理生成实现类,支持增删改查及参数... 目录一、什么是 MyBATis二、 MyBatis 入门2.1、创建项目2.2、配置数据库连接字符串2.3、入

Springboot项目启动失败提示找不到dao类的解决

《Springboot项目启动失败提示找不到dao类的解决》SpringBoot启动失败,因ProductServiceImpl未正确注入ProductDao,原因:Dao未注册为Bean,解决:在启... 目录错误描述原因解决方法总结***************************APPLICA编

深度解析Spring Security 中的 SecurityFilterChain核心功能

《深度解析SpringSecurity中的SecurityFilterChain核心功能》SecurityFilterChain通过组件化配置、类型安全路径匹配、多链协同三大特性,重构了Spri... 目录Spring Security 中的SecurityFilterChain深度解析一、Security

SpringBoot多环境配置数据读取方式

《SpringBoot多环境配置数据读取方式》SpringBoot通过环境隔离机制,支持properties/yaml/yml多格式配置,结合@Value、Environment和@Configura... 目录一、多环境配置的核心思路二、3种配置文件格式详解2.1 properties格式(传统格式)1.

Apache Ignite 与 Spring Boot 集成详细指南

《ApacheIgnite与SpringBoot集成详细指南》ApacheIgnite官方指南详解如何通过SpringBootStarter扩展实现自动配置,支持厚/轻客户端模式,简化Ign... 目录 一、背景:为什么需要这个集成? 二、两种集成方式(对应两种客户端模型) 三、方式一:自动配置 Thick

解决pandas无法读取csv文件数据的问题

《解决pandas无法读取csv文件数据的问题》本文讲述作者用Pandas读取CSV文件时因参数设置不当导致数据错位,通过调整delimiter和on_bad_lines参数最终解决问题,并强调正确参... 目录一、前言二、问题复现1. 问题2. 通过 on_bad_lines=‘warn’ 跳过异常数据3

Spring WebClient从入门到精通

《SpringWebClient从入门到精通》本文详解SpringWebClient非阻塞响应式特性及优势,涵盖核心API、实战应用与性能优化,对比RestTemplate,为微服务通信提供高效解决... 目录一、WebClient 概述1.1 为什么选择 WebClient?1.2 WebClient 与

Java.lang.InterruptedException被中止异常的原因及解决方案

《Java.lang.InterruptedException被中止异常的原因及解决方案》Java.lang.InterruptedException是线程被中断时抛出的异常,用于协作停止执行,常见于... 目录报错问题报错原因解决方法Java.lang.InterruptedException 是 Jav

深入浅出SpringBoot WebSocket构建实时应用全面指南

《深入浅出SpringBootWebSocket构建实时应用全面指南》WebSocket是一种在单个TCP连接上进行全双工通信的协议,这篇文章主要为大家详细介绍了SpringBoot如何集成WebS... 目录前言为什么需要 WebSocketWebSocket 是什么Spring Boot 如何简化 We