JS 里的数据类型转换,内存,深拷贝,关于内存的面试题等等

image.png

普通类型是???

number String Boolean Symbol null undefined 6种基本类型

对象类型是???

Object 对象类型就是上面6种类型的集合 也就是复杂类型

类型的转化

image.png

转化成String有四种方法

image.png
Window.String()
使用window.String()转化成String
String() 全局方法
String(XXX)将其他类型转化成String
(xxx).toString()

nullundefined没有toString方法,只能用''+nullnull转化为字符串.这是与String()的不同

(xxx).toString()

其中null、undefined、object转化失败,但是(obeect).toString()可以

这个错误:不能读toString方法,说明没有这个api

有些地方会自动调用toString()这个API,比如console.log(1),其实是console.log((1).toString()).

利用+转换为String最简便方法

XXX+'' 老司机方法(利用+转换为String最简便方法)

XXX+''

其中{}+''会变成0,但是先用变量o赋值{}之后,就是String

转化成Number的5种方法

image.png
image.png

parseInt()参数中第一个参数是要转化的值,第二个参数代表的进制

image.png

简便方法'1234'-0(常用)

image.png

简便方法二+'1'取正

image.png

转化成Boolean的方法

Boolean(xxx)
Boolean(XXX)
!!(老司机方法)
image.png
仅有的五个false值
image.png

falsy(虚值)是在 Boolean 上下文中已认定可转换为’假‘的值,在使用强制类型转换转换成boolean时为 false。有以下五个为false,其他值都为true。

image.png

MDN Flasy

这五个特殊值分别是0 NaN null '' undefined
但是 所有的对象Object都是true

GC垃圾回收

回收内存
如果一个对象没有被引用,他就是垃圾,就会被回收(没有引用找不到他,所以要回收)

image.png

例子

image.png

内存泄漏(IE6BUG)

但是IE6有bug不会清垃圾。请在结束一天工作后用下面代码清垃圾。
解决方法:

window.onunload=function(){
     document.body.onclick=null;
}

内存机制

内存图

image.png

最终JS分配到100M

你买一个 8G 的内存条
操作系统开机即占用 512MB.从硬盘读取到内存
Chrome 打开即占用 1G 内存
Chrome 各每个网页分配一定数量的内存
这些内存要分给页面渲染器、网络模块、浏览器外壳和 JS引擎(V8引擎)
JS 引擎将内存分为代码区和数据区
我们只研究数据区
数据区分为 Stack(栈内存) 和 Heap(堆内存)
简单类型的数据直接存在 Stack 里
复杂类型的数据是把 Heap 地址存在 Stack 里(对象包括:狭义对象,函数,数组)

JS中的内存

image.png
image.png

代码区和数据区(右两个)
代码区与数据区有一个关联,a存在代码区,'1'存在数据区

代码区与数据区

代码区变量提升

  1. 字符串,数值,都是在64位上直接存的.所以如果b=a;那么会把a上的64个比特复制给b.(深拷贝)
image.png
  1. 对象那个64位比特上存的是地址,因为对象大小可变,如果对象变长了,内存后面的都要往后退,所以用了一种解决方法,只在栈内存里存地址,地址指向堆,也就是存的堆门牌号,门牌号里的东西在堆里


    image.png

如果对象中的o2=o;只是内存中的栈内存换复制了一个值,这个值就是o的堆内存的地址.(浅拷贝)

image.png

值的存储方法,两种,基础类型六个存入stack,复合类型对象存入heap

浏览器先进行所有的变量提升(变量声明);按顺序在stack先存好对象,后期再加属性值会很麻烦,所以在stack栈内存 存 对象在heap堆内存的地址,对象的内容实际上存在堆内存里。

image.png
数值与字符的存储大小

64个二进制位(比特Bit)表示数值

每个字符在 JavaScript 内部都是以16位(即2个字节)的 UTF-16 格式储存。也就是说,JavaScript 的单位字符长度固定为16位长度,即2个字节。

image.png

引用
obj存了某个对象{name:'1'}地址,比如地址是是100.
那么就说obj是对象{name:'1'}的引用
对象与变量(obj)之间的关系称为引用关系

image.png

面试题

var a = 1
var b = a
b = 2
请问 a 显示是几?  

答: 1

例题1
var a = {name: 'a'}
var b = a
b.name = 'b'
请问现在 a.name 是多少?

答: 'b'

例题2.1
例题2.2
var a = {name: 'a'}
var b = a
b = {name: 'b'}
请问现在 a.name 是多少?

答: 'a'

例题3
var a = {name: 'a'}
var b = a
b = null
请问现在 a 是什么?

答: {name: 'a'}

浅拷贝例子解析2

注意 b= a; b=null;是不会改变隐藏对象里的内容的,只有x.key = ‘yyy’才能改变对象里的内容,画图好理解。

下面的例子易弄混,需要注意!!!

image.png

模拟执行过程:(Heap堆内存里存着两个对象{n:1}和{n:2},地址为随机分配的addr34 和addr54)

var a = {n:1}    //var a,var {n:1}, a===addr34
var b = a         //var b ,b===addr34 '='是浅复制
a.x = a = {n:2} //这句话最容易理解错,首先浏览器从左往右看,再从右往左计算。
                       //从左往右看的时候,`a.x = a`里的第一个a, `a===addr34`,
                       //从右往左计算的时候,先执行a={n:2}, 执行后a的指向变了,a===addr54;b仍然指向addr34
                       //然后a(addr34).x=a(addr54)。故a.x = a = {n:2}执行结束后,addr34地址存的对象多了一个属性x,属性x的值为addr54,即对象{n:2}在Heap里的地址。
                      //而b还是指向Heap地址为addr34这个对象,即b===addr34

最后答案就是 :a.x 这里面的a 指向的是addr 54,而addr54里面没有a.x 故Undefined
b.x 里面的b 指向的是addr 34这个地址,通过上面的运算 得知 这个地址里面有x这个对象,所以b.x =addr54这个地址的{n:2}

  1. 垃圾回收面试考点


    image.png
image.png

解析:第一个声明为fn这个对象,然后 下面的document ===fn
所以在内存中中的地址如第二张图,onclick引用了这个function,所以这个function被两个引用。
之后这个fn=null,但是function这个还是背onclick引用,所以这个function不会被垃圾回收。

  1. 循环引用


    image.png

解析:

image.png

将上面的第一个和后面的分开来理解,首先声明一个a,这个a没有被赋值,它的值是Undefined。下一个a={self:a},在这句里面,js先计算花括号里面的,它将这个a赋值给了self,这个self的值是什么,它就是a的值,a的值是什么,是undefined,所以最后self的值就是undefined。最后再将这个对象的值赋值给a。

下一个如何理解???
首先这个a赋值为{}。这是一个对象。然后a.self =a ,这说明在内存中是这样的

image.png

它这个里面的self的值就是a,a是什么,a是{},然后 这个a里面还会是a.self,那么a.self后面又是什么 ,还是一个{}.......一直循环
所以最后a.self.self是什么???答案就是上面最后输出的结果

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

推荐阅读更多精彩内容