前端的数据类型和堆栈的管理(js基础第一节)

最近一段时间由于时间充裕,原来都是些原生项目,经过两年的前端摸索,开始说下我对前端的了解.

ECMAScript中有5中简单数据类型(也称为基本数据类型): Undefined、Null、Boolean、Number和String。还有1中复杂的数据类型(引用数据类型)————Object,Object本质上是由一组无序的名值对组成的。但是这几种数据类到底有什么区别呢。这些数据又是如何存储在内存中的呢,这些数据和浅拷贝深拷贝有什么区别呢。在这里我说下我对前端js 的理解.

一、数据类型和堆栈

首先基本的数据类型有五种。分别为:Undefined、Null、Boolean、Number 和string。那么为啥叫这几种为基本数据类型呢。因为这几种数据都是存在栈(stack)中。严格意义上来讲还存在一种指针也存在stack 中。如创建一个对象 var a= function(){}, 那么其实a 这个指针也是存在stack 中, 引用数据类型则存储在堆(heap)中。其实从字面意思可以看出所谓的引用类型两字我们可以理解为对象的赋值是浅拷贝 。举个例子 var a= {m:'123'} ,var b=a;那么 其实意思就是 a和b 指向同一个堆区域。当a 指向的对象的内部改变的时候,b也改变。 

这里要记住的是a 指向对象的内部 改变,如果你此时 改变 a='123',那么 肯定不可能b=‘123’,因为b指向的对象和a 指向的对象根本就不同了。也就是说当a,b 指向同一个对象的时候,a改变,那么b改变。以下图片对js 堆栈的完美解释


浅拷贝:在js中。除了基本数据类型,当数据的数据类型为引用对象的时候,那么赋值都是浅拷贝。类

深拷贝:所谓的深拷贝。就是在heap 中复制一份一样的引用对象类型的数据,在stack 中的两个指针分别指向heap 中的两个对象。此时修改 a数据 改变不了b 数据。那么肯定也就存在 a 数据不等于b 数据。对于js 来说深拷贝我觉得只要记住一种就行:json.parse(json.stringify(xxx)) 

扩展运算符:在这里肯定很多人对扩展运算符有不解的地方. var a={m:"123",n:"234",k:{f:'xxx'}}; var b={...a};比如这个。很多人不理解扩展运算符是深拷贝还是浅拷贝。这里我必须说明 扩展运算符是浅拷贝。用一句话总结扩展运算符:就是将将被扩展的对象内部的引用对象进行浅拷贝.(内部的引用对象浅拷贝这句话理解清楚即可)。扩展运算符 a,b 两个指针指向的heap 位置肯定是不一致的。但是 内部的引用对象指向的heap 位置肯定是一致的  。这里我举个例子说明下 

二、判断js 数据类型的方法。

面试题必备的知识

typeof 判断 typeof 返回的是string ,有以下几种返回


 如图我们可以总结四点:

对于基本类型,除 null 以外,均可以返回正确的结果。

对于引用类型,除 function 以外,一律返回 object 类型。

对于 null ,返回 object 类型。

对于 function 返回  function 类型。

那么也就是说type 对于引用对象的判断 除了function 可以判断。其他都不可以所以来说typeof判断引用对象是不可以的,但是在开发过程中,如果是基本数据类型,则是可以的。还是一句话。需求决定一切。还存在以下几种判断方法。

instanceof 进行数据判断如下图所示


instanceof 可以理解为是判断 a是不是b的实例。这层关系是通过原型链进行判断的。我们知道[]的原型链 链指向的 Array ,但是Array 的原型链指向object. 可以理解为 只要指向了某个原型链(中间可能存在),那么可以判断这个a是什么类型。


3.constructor

利用构造函数进行判断.当一个引用对象被申明的时候,那么会为其添加上prototype 原型,然后在原型上添加他的构造函数,所以可以通过构造函数进行判断对象的类型。如下图所以

但是constructor 存在一个问题,因为prototype  是可以被重写的,那么就可能导致判断错误如下图所示


4. tostring方式,也是最简单便捷的方式。这里我就不举例子了。直接拿来用


©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 158,560评论 4 361
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,104评论 1 291
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 108,297评论 0 243
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 43,869评论 0 204
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,275评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,563评论 1 216
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,833评论 2 312
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,543评论 0 197
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,245评论 1 241
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,512评论 2 244
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,011评论 1 258
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,359评论 2 253
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,006评论 3 235
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,062评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,825评论 0 194
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,590评论 2 273
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,501评论 2 268

推荐阅读更多精彩内容

  • Swift1> Swift和OC的区别1.1> Swift没有地址/指针的概念1.2> 泛型1.3> 类型严谨 对...
    cosWriter阅读 11,034评论 1 32
  • __block和__weak修饰符的区别其实是挺明显的:1.__block不管是ARC还是MRC模式下都可以使用,...
    LZM轮回阅读 3,204评论 0 6
  • 专业考题类型管理运行工作负责人一般作业考题内容选项A选项B选项C选项D选项E选项F正确答案 变电单选GYSZ本规程...
    小白兔去钓鱼阅读 8,892评论 0 13
  • 最全的iOS面试题及答案 iOS面试小贴士 ———————————————回答好下面的足够了-----------...
    zweic阅读 2,566评论 0 73
  • 这个暑假里,我们一家去贵阳旅游。到了贵阳,我们首先想到去的景点,那就是到了贵阳必须去的地方——黄果树大瀑布...
    谢建辉阅读 142评论 0 1