JavaScript 数据类型、函数、闭包


 

数据类型

基本数据类型

  • string 单双引均可
  • number 数值型
  • boolean
  • null
  • undefined 未定义

复杂数据类型

  • Array 数组
  • Object 对象

检测数据类型的两种⽅法

  • typeof() 只能检测基本数据类型,复杂数据类型都显示为object
  • Object.prototype.toString.call() 检测复杂数据类型(引用类型),会显示object下具体的类型(Object、Array)
  console.log(typeof(""));  // string
  console.log(typeof(1));  // number

  console.log(Object.prototype.toString.call({}))  // [object Object]
  console.log(Object.prototype.toString.call([]))  // [object Array]

变量

   var i;  //只声明未赋值,类型是undefined

   var j=10;  //js的变量是弱类型的,根据值来确定变量类型

   j="ok";  //js变量的数据类型可变

变量标识符

  • 可以包含英文字母A-Za-z、数字0-9、下划线_、美元符号$
  • 不能以数字0-9开头

js区分大小写,username、userName是2个不同的变量

类型转换

显式转换:

  var a;

  // 转换为数字
  a=Number("1.6");  // 转换为数字
  a=parseInt("1.6");  //转换为整型,直接舍弃小数部分
  a=parseFloat("1.6");  //转换为浮点型

  a=Number("xyz");  //如果不能转换为数字,不会报错,转换结果是NaN,即Not a Number
  console.log(a);  //NaN


  var b=1.4;

  // 转换为字符串
  b=b.toString();
  b=String(1.2);


  // 转换为boolean
  var c=Boolean(0);  //0是false,非0是true

隐式转换:自动完成类型转换

  a=1.2+"";  //字符串拼接。如果有一个加数是字符串,会自动将其它加数转换为字符串,再进行运算
  
  
  if(12=="12"){ //相等判断时,如果一方是字符串,会自动先将另一方转换为字符串,再进行判断
  console.log("true")
}	

数组

  // 直接创建
  var arr1=[];  //创建空数组
  var arr2=[1,2,3,4];  //创建数组并初始化


  // 使⽤构造函数创建
  var arr3 = new Array();  //创建空数组
  var arr4 = new Array(2); //创建⼀个初始长度为10的数组。如果参数个数=1,该参数是数组的初始长度
  var arr5 = new Array(1,2,3,4); //如果参数个数>1,参数是数组元素


  // 数组元素的赋值、获取
  arr5[0]=10; 
  console.log(arr5[0]);

js数组的长度会动态变化,指定的初始长度只是创建数组时预先分配空间,后续空间不够时会自动扩容。

对象

  // 直接创建
  var obj1={};  //创建空对象
  var obj2={name:"chy",age:20};  //创建对象并初始化


  // 使⽤构造函数创建
  var obj3=new Object();  
  var obj4=new Object({name:"chy",age:20});


  // 通过点号设置、获取对象某个属性的值
  obj4.name="zhangsan";
  console.log(obj4.name);

函数

函数出现的意义:封装代码,方便调用、复用。

函数的定义、调用
  // 定义函数常用的方式
  function f1(){
    console.log(1);
  }

  var f2=function(){
    console.log(2);
  }

  // ES6的箭头函数常用来代替匿名函数,()中写参数
  var f3=() => {
    console.log("3")
  }

  // 在事件监听中也常用匿名函数


  // 通过函数名来调用
  f1();
函数传参
  //函数传参。形参直接写参数名,不加var
  function f4(name,age){
    console.log(name);
    console.log(age);
  }

  // 调用
  f4("chy",20);
  

  //不定个数的参数
  function sum(){
    var sum=0;
    for(var i=0;i<arguments.length;i++){
      sum+=arguments[i];
    }
    console.log(sum);
  }

  // 调用
  sum(1,2);
  sum(1,2,3,4);

js的函数参数是把实参的值copy一份传给形参(浅拷贝),
如果参数是基本类型,则对形参的修改不会影响实参;
如果参数是数组、对象这些引用类型,传递的是引用(地址),对形参的修改就是对实参的修改。

函数返回值
  function sum(a,b){
    return a+b;  //return会终止函数执行
  }

  var result=sum(1,2);
  console.log(result);

return不是必需的,如果没有return,默认返回undefined。

return只能返回一个值,如果要返回多个值,可以放在数组、对象中返回。

变量作用域

  <script>
    var a=1;
  </script>

  <script>
    console.log(a);
  </script>

当前文件中的所有script标签,不管是src引入脚本,还是自己现写脚本,都可以看成在一个script标签内。

在函数内部定义的变量是局部变量,只能在函数内部使用;
在函数外部定义的变量是全局变量,在整个文件的script脚本中(包括函数中)都可用。
如果有同名的全局变量、局部变量,在局部变量的作用域内,局部变量会覆盖同名的全局变量。

作⽤域链:只有在当前作⽤域内找不到定义,才会向⽗级作⽤域
找,一级一级往上找,直到找到,如果到最外层作用域还找不到就报错。

闭包

  function f1(){
    var a = 1;
    // 返回内部函数的引用
    return function(){
        // 内部函数中使用外部函数中的局部变量
        a++;
        console.log(a);
    };
  }

  // 这是内部函数引用
  var f2 = f1();

  // 调用内部函数
  f2(); //2
  f2(); //3
闭包的特点
  • 函数嵌套函数,外部函数返回内部函数的引用。
    定义内部函数的时候,不能function(){ }这样直接定义,需要把函数引用赋给变量,或者写成匿名函数。
  • 内部函数引用外部函数中的变量
闭包的优点
  • 外部可以访问局部变量。
    通过调用内部函数间接访问外部函数中的局部变量。
  • 外部函数、内部函数中的局部变量长期保存在内存中,不会被gc回收。
    外部函数的变量被内部函数使用,内部函数的引用又被全局变量使用,外部函数执行完毕后,这些被内部函数引用的变量不会被gc回收,内部函数中的局部变量也不会被gc回收,可以长期保存局部变量,相当于缓存
  • 外部函数定义的内部函数,可以外部函数自己使用,也可以在全局中使用(方法暴露出来了)
闭包的缺点
  • 局部变量长期保存在内存中,内存消耗很大,对网页的性能有影响
    这也是不要大量使用闭包的原因

  • 在IE中可能导致内存泄漏
    因为内部函数持有外部函数方法区的引用,即使内部函数只引用外部函数的部分变量,外部函数所有的局部变量都不会被销毁,不使用的局部变量可能发生内存泄漏。
    解决办法:在外部函数的return之前删除没有被内部函数引用的局部变量。
    删除是把变量赋值为undefined,eg. a=undefined

switch语句

  function f(role){
    switch(role){
      case "user":
        console.log("user");
        break;
      case "admin":
        console.log("admin");
        break;
      default:
        console.log("不合法的角色");
    }
  }

  f("admin");

逻辑判断

假:false、数字0、空串、null、undefined、NAN
真: 除开上面假的,都是真

&& 与
|| 或
! 非

命名规范

  // 变量名、函数名均使用camel写法(驼峰命名)
  var goodsPrice=10.00;

  function getGoodsPrice(){

  }
  

  // 常量名全大写,单词之间下划线连接
  var ORDER_STATUS="paid";
原创文章 18 获赞 2 访问量 1806

猜你喜欢

转载自blog.csdn.net/chy_18883701161/article/details/106088219