一个变量引发的一场知识海洋

前言

很多作者写框架及架构时,都是在实战中获得验证,得出某个特定的结论,在一个知识海洋中,有认证,认据,反认证等等是一个循环体.
从一个简单的框架,集成各种功能,变的越来越复杂,要维护这些也就趋向一种,能看的懂的文档,而这种活,那是倍增的劳动力.
所以当你看到一个框架时,请吸取他的精华,并分享自己观点,在达到一程度时可以帮助其完善,一种github精神.
当我每次去上课时,老师讲的是基础理论,在消化老师讲的内容以外,可以更多实战的验证理论性知识,有时可以用多种方法合成一种或举一反三等等
遇到一件特别需要不按常规来处理的时候,就应该以发散思维去思考.
现在有大批的开发人员,就是没有做到发散思维寻找答案,还一直处于基础理论学.

在我面试别人的时候,时常去看对方的作品及问作品中实质的东西,我就能大致理解其能力及是否我所需要的人

前端的知识非常多,不仅仅是js,html,css,oc,android,u3d,as3等等,技术的更新非常之快,不要以井底之蛙之心态.
不懂可以百度,可以google,找书,人类本身是一种不断完善自我,不断创新的高级种群.相信你自己,一定可以的!

从变量的范围开始

  • 局部变量
    var 定义的是局部变量,可以销毁
    function(){
    var ok=’pp’;//局部变量
    }
    console.log(ok)//undefined

  • 全局变量
    优势:不用强制var定义,就可以是全局变量
    缺点:比较混乱,在严格模式下,会报未定义(ReferenceError引用错误)

    ‘use strict’;//此模式下会报undefined;
    function(){
    ok=’pp’;//此时全局变量
    }
    console.log(ok);//pp,

可读性

  • 多语句写成一行,提高可读性
    var a=0,b=0,c=0;

原始类型(基本类型) 简单类型———— 静态数据

undefined,null,boolean,string,number,不容易改变数据

1
2
3
4
var a=1;
var b=a;
a=2;
console.log(a,b);//2,1
  • undefined
    区分对象指针null与未初始化的变量
    1:未定义,不存在,不占内存单元
    2:没有被赋值,占内存单元
    var mes;
    console.log(mes);//undefined
    undefined==null;//true,值一样
    undefined===null//false,不全等,类型不一样
    var a=’ok’;
    (function(e){
    console.log(a,e);//ok,undefined
    })();
    (function(){
    console.log(a,e)//ok,未定义报bug(ReferenceError)
    })();

javascript有两个无:undefined,null

Google公司开发的JavaScript语言,替代品Dart语言,只有null

历史原因:引用c语言习惯
Number(null);//0
5+null;//5
解决:由于null是对象中的无,而数据类型没有定义,直接报bug,所以定义 了一个undefined

其他:
C语言的NULL,Java语言的null,Python语言的None,Ruby语言的nil。

  • null
    对象为空的指针
    1:值被定义为 对象空对象指针,开辟内存单元
    2:可以被自动回收
    在java中,经常出现,如果null 转为数值0,不容易发现问题,所以创造出一个undefined数据判断“无”定义,原始值
    通用:
    对象空
    原始链终点
    Object.getPrototypeOf(Object.prototype);//null

  • boolean
    true/false,是值
    True/False只是标识符
    var a=’ok’;
    Boolean(a)//true,非空或非0

  • number
    1.8进制 070 //10# 56
    2.无效8进制 08 //10# 8
    3,0x十六进制 //0xff0000
    4.+0,-0都是0,-0
    5.浮点数内存 是 整数的2倍,可以用3.15e3=3150
    6.NaN,非数值,不是number var p; p/10; //NaN
    7.超过number范围1.7976931348623157e+308,就是无穷infinity
    8.数值转换 parseInt,parseFloat,但是true,八进制,十六进制是无法转成正常数字,

    var a=010,b='true',c='12d3d';parseInt(a),parseInt(b),parseInt(c);//8,NaN,12
    //2,8,10,16进制
    parseInt('0101',2),parseInt('5',8),parseInt('4',10),parseInt('0xf0',16);//5,5,4,240
    
  • string
    一旦创建字符串,值是不可变内容。
    原理:销毁前面的值,填充新的内容值,ie7+
    缺点:早期版本,拼接时速度过慢
    1. var s=’ok’;
      s=s+’pp’;
      //ok pp给s变量,再销毁ok,pp的内容
    2. 转换字符toString();
      //2,8,10,16进制
      var s=10;
      s.toString(),s.toString(2),s.toString(8),s.toString(10),s.toString(16);//‘10’,’1010’,’12’,’10’,’a’
    3. ‘’+3;//字符串“3”

合成类型(引用类型) 复杂类型———— 动态数据

object,array,容易改变数据,引用对象数组,而不是对象数组本身

1
2
3
4
var a=[1,2];
var b=a;
a[0]='ok';
console.log(a,b);//'ok',2 'ok',2
  • object

    1. constructor构造函数
    2. hasOwnProperty(string)检测对象内的属性是否存在
    3. isPrototypeof(object),object是否是原型链对象
      function pp(){}
      var a=new pp();
      console.log(pp.prototype.isPrototypeOf(a));//true
    4. var a=function(){}就是一个原型链对象
      a.proto 对象属性 ,当前原型对象
      a.constructor.prototype函数才有的属性,当前构造函数生成的原型对象

      1
      2
      3
      4
      5
      6
      //另一种原型链
      function pp(){}
      pp.prototype.ok=function(){}
      var a=new pp();
      console.log(a.__proto__,pp.prototype)//两者才一样
    5. 宿主对象,BOM,DOM中的对象,有可能不继承object

栈内存

优点:运行效率 > 堆内存
缺点:空间 < 堆内存
undefined,null,boolean,string,number地址
undefined,null,boolean,string,number内容
Object,array地址

堆内存

Object,array内容

内存周期

1.内存泄漏,
funtction test(){var a={},b={}} 不停的引用test(),造成有些空间不回收,仍然引用计数
解决:a=null,b=null,才真正回收
2,闭包最容易产生内存问题

label代码中添加标签,以便将来使用

1
2
3
var x=0;
label:if(x==0){x++,break label};
console.log(x);//1

arguments.callee

函数自身

递归算法

1
2
3
4
5
6
7
8
9
10
11
function pp(n) {
if (n <= 0) {
return n;
}
else {
return n + pp(n - 1);//n!2!=0+1+2
}
}
//pp[0]+pp[1]+pp[2]
//0+1+2
console.log(pp(10));//55

延迟脚本

优点:下载完所有body内容后,再执行js脚本 ,并优先于DOMContentLoaded事件,
缺点:建议只包括一个延迟脚本,以免很难控制先后顺序

1
2
<script defer='defer' />
!若不想使用延迟脚本 defer可以,把script放在</body>前

异步脚本

优点:不等待其他脚本文件,不阻塞文档呈现
缺点:不保证按指定,先后顺序执行,两个互相依赖就会出一些问题

1
2
<script async=‘async’ src='a.js' />
<script async=‘async’ src='b.js' />