js学习笔记2(变量,作用域,内存,包装类)

1.原始值和引用值

原始值:基本数据类型;Undefined,Null,Boolean,Number,String,Symbol(ECMAScript6加入的)。(String在其他语言中是使用对象表示的,因此被认为是引用类型。)我们实际操作的就是存储在变量中的实际值。
引用值:复杂数据类型;Object对象,保存在内存中的对象,实际操作的时候,我们操作的是这个对象的引用而非实际值。

  • 传递参数:ECMAScript中所有函数的参数都是按值传递的,即使参数是对象也是按值传递,而非引用传递。函数中的参数就是局部变量
 function setName(obj) {
        obj.name = 'Five';
        obj = new Object(); //obj在函数内部重写时,
//它变成一个指向本地对象的指针。而那个本地对象在函数执行结束时候就销毁了。
        obj.name = "小马哥";
    }
    let obj = new Object();
    setName(obj);
    console.log(obj.name);  //Five

作用域链:在同一个class中,函数里面的局部变量和全局变量形成一个作用域链。函数里面可以访问全局变量,而函数外部无法访问函数内部的局部变量。

2.垃圾回收
  • 标记清理
    垃圾回收程序运行的时候,会标记内存中存储的所有的变量(标记的方法有很多,比如当变量进入上下文的时候反转某一位,或者维护“在上下文中”和“不在上下文中”两个变量列表),然后它会将所有在上下文中的变量,以及被在上下文中的引用的变量标记去掉,在次之后再被加上标记(清理标记)的变量就是待删除的了,原因是任何再上下文中的变量都访问不到它们了。随后垃圾回收程序做一次内存清理,销毁带有标记的所有值,并回收他们的内存。
  • 引用计数
    对于每个值都记录它被引用的次数。声明变量并给它赋一个引用值时,这个值的引用数为1。如果同一个值又被赋值给另外一个变量,那么引用加1。类似的,如果保存对该值引用的变量被其他值给覆盖了,那么引用数减1。当一个值的引用数为0的时,就说明没有办法访问到这个值了,因此可以安全的回收其内存。垃圾回收程序下次运行的时候就会释放引用数为0的值的内存。但是在循环引用的时候会出现问题。
//循环引用,导致引用数不为0,内存无法释放
   function problem(){
       let objectA = new Object();
       let objectB = new Object();
       
       objectA.someOtherObj = objectB;
       objectB.anotherObj = objectA;
   }
3.内存管理

优化内存占用的最佳手段就是保证在执行代码时,只保存必要的数据。如果数据不再需要,就把它置为null,从而释放其引用。这也可叫做解除引用

  • 1.通过const和let声明提升性能:因为这两个关键字都是以块(非函数)为作用域,所以相对于var关键字,可以尽早的释放内存。
  • 2.隐藏类和删除操作:根据JavaScript所在的运行环境,有时候需要根据浏览器使用的JavaScript引擎来采取不同的性能优化策略。在V8引擎中会使用到“隐藏类”,运行期间V8会将创建的对象与隐藏类关联起来,以跟踪他们的属性特征,能共享相同隐藏类的对象性能更好。
 function  Article(){
        this.title = '这个是文章的标题';
    }
    let a1 = new Article();   //此时,a1,a2,这两个实例会共享相同的隐藏类,
    let a2 = new Article(); //因为这两个实例共享同一个构造函数和原型。

    a2.author = '小马哥';//此时这两个实例对应两个不同的隐藏类
    
    //解决方案
    function Article(opt_author) {
        //在构造函数中一次性声明所有的属性,而不是“先创建后补充”
        this.title = '这个是文章的标题';
        this.author = opt_author;
    }
    let  a1 =new Article();
    let  a2 =new Article('小马哥');

    //使用delete之后,即使两个实例使用了同一个构造函数,他们也不共享一个隐藏类。
    //最好的方法是置为null
    delete  a2.author;
  • 3.内存泄漏:JavaScript中的内存泄漏大部分是由不合理的引用导致的。
    a.意外声明全局变量是最常见但也是最容易修复的内存泄漏问题
   //此时解析器会当成window的属性来创建name,只要window不被清掉,name就不会被回收
   function setName(){
       name = '小马哥';
   }

b.定时器也可能会导致内存泄漏

let name ='小马哥';
   setInterval(()=>{
       //只要定时器一直运行,name就会一直占用内存。
       console.log(name);
   },1000);

c.JavaScript闭包造成内存泄漏(有不同的观点:renturn的匿名函数才是闭包,闭包调用结束之后,里面引用的变量就都断了引用,所以造成内存泄漏的不是闭包,旧版本的IE,待考量。

 let outer = function (){
       let name = "小马哥";
       return function (){
           return name;
       }
   }

调用outer()会导致分配给name的内存被泄漏。上面代码执行后创建了一个内部闭包,只要返回的函数存在就不能清理name,因为闭包一直引用着它。如果name的内容很大(不只是一个小字符串),后果就很严重。

  • 4.静态分配与对象池:为了提升JavaScript行能,最后考虑的一点就是压榨浏览器,减少浏览器执行垃圾回收的次数,理论上,如果可以合理使用分配的内存,同时避免多余的垃圾回收,那么就可以保住因释放内存而损失的性能。
4.包装类型操作方法
  • 1.Number
 let num = 100;

 //num.toFixed(2)  取小数点后某位,自动四舍五入
 console.log(num.toFixed(2));  //10.00

 //num.toExponential(1)科学计数法
 console.log(num.toExponential(1)); //1.0e+2

 //toPrecision(),会根据结果返回最合理的输出结果,可能是固定长度也可能是科学计数法
 console.log(num.toPrecision(1)) //1e+2
 console.log(num.toPrecision(2))//1.0e+2
 console.log(num.toPrecision(3)) //100
 
 //ES6新增方法,用于辨别一个数值是否保存为整数
 console.log(Number.isInteger(1)) //true
 console.log(Number.isInteger(1.00)) //true 
 console.log(Number.isInteger(1.01)) //false
  • 2.String
let str = 'abcd';
//concat()字符串拼接,但是常用的还是‘+’
let result = str.concat('efg');
console.log(result); // abcdefg

//同java方法
//str.slice()  
//str.trim()
//str.trimLeft()   str.trimRight()
//str.repeat()
//str.substring(a,b)   返回下角标a至下角标b的字符串
//str.substr(a,b)   返回下角标a,后面b个字符
//str.indexOf(a)
//str.lastIndexOf(a) 
//str.endsWith(a)  ES6添加
//str.startsWith(a)  ES6添加  可以添加第二个参数 表示从第几位开始
//str.includes(a)  ES6添加    可以添加第二个参数 表示从第几位开始

let message = 'foobarbaz';
console.log(message.startsWith('foo')) //true
console.log(message.startsWith('foo',1)) //false

a.字符串的结构:字符串的原型链上暴露了一个@iterator方法,表示可以迭代字符串的每个字符。

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