js起步(大多是基础概念)

本文深入探讨JavaScript的历史、实现原理及在HTML中的应用,讲解基本数据类型、引用类型、操作符、语句、函数等核心概念,同时涵盖变量、作用域、内存管理、内置对象等内容。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

一、起步

1.1 JavaScript简介

不同的浏览器都致力于实现自己的客户端脚本语言,比如从Netscape的LiveScript(为蹭热度改名为JavaScript)再到后来微软的JScript。由于不同版本的JavaScript没有统一的语法,所以ECMAScript出现了,其作为JavaScript实现的基础,规定的JavaScript实现的语法。

1.2 JavaScript实现

JavaScript通常由EcmaScript、文档对象模型、浏览器对象模型组成。

  • ECMAScript:ECMAScript是JavaScript语言的实现基础,宿主环境实现的ECMAScript规范并拓展了次规范。比如浏览器拓展了BOM、DOM。Node环境也实现了ECMAScript规范同样也可以作为JavaScript开发平台。
  • DOM(文档对象模型):提供访问和操作网页内容的方法和接口。
  • BOM(浏览器对象模型):提供与浏览器交互的方法和接口。

1.3 JavaScript在HTML中的实现

  • JS脚本放在script标签中,可以直接通过script标签的src属性引入,也可以直接在script中编写,但要注意的是脚本中不要出现’'标签,不然会出现解析错误。

    <script type="text/javascript" src="example.js"></script>

       function sayScript(){
       alert("</script>"); //解析错误,需要在斜杠前加\转义确保正确解析。
       }
      </script> 
    
  • script标签放置位置

    由于HTML文档从上往下解析,当把script标签放置到head标签中时,浏览器会解析完JS文件才会往下解析,如果js文件过大则用户会感觉到延迟,推荐放置到body最下方。

  • script常用属性

    defer属性,延迟脚本,立即下载,延迟执行,此属性会延迟脚本的执行,只用于引用外部JS文件。存在浏览器兼容性问题。保证执行顺序。
    async属性,不能确保两个相同地位的脚本顺序执行,可以异步执行文档种的内容。

1.4 <noscript></noscript>标签使用场景

  • 浏览器不支持脚本;
  • 浏览器支持脚本,但脚本被禁用。

1.5 JavaScript基本概念

  • 命名规范:标识符数字、字母、下划线、$。第一个字符不可以是数字。不能和关键字冲突,遵循驼峰命名法,严格区分大小写。
  • 注释分为单行注释//以及多行注释/* …*/
  • 变量相关说明:var 声明并且定义一个变量,如果在函数内定义变量而不加var,则默认定义了一个全局变量。
  • 5种基本数据类型,一种复杂类型:
    • Undefined类型,只有一个值即undefined,当变量声明后而没有初始化,JS会自动赋undefined。
    • Null类型,只有一个特殊值为null,表示空对象指针,即用typeof来看它的值为object
    • Boolean类型,有两个特殊值true,false。可以对任何数据类型的值调用 Boolean()函数,而且总会返回一个 Boolean 值,’ ',0,null,undefined,NaN转换为false,其余转换为true。
    • Number类型:number类型具体分为float(双精度、)数值范围、NaN、数值转换。
      • 0为前导数表示八进制,045。浏览器自行解析,注意:严格模式下无效,抛异常。
      • 0x为前导数表示十六进制,0x3A。
      • 算数运算时都将转化成十进制。
      • 浮点数值相关知识:
        1. 浮点数占据的内存空间要比整数大两倍,浮点数会将1.0、1.这些相类似的数自动转换成整数。
        2. e表示法表示比较大或小的数值,如3e10表示30000000000.
        3. 注意:不要对浮点数对加减测试,如0.1+0.3不等于0.4。
      • 数值范围:
        1. Number.MAX_VALUE/Number.MIN_VALUE分别表示JS所能达到的最大和最小值。如果超出这个范围则会表示成+Infinity、-Infinity,无穷的值是不能够计算的。判读某数值是否是无穷,用isFinite()方法。
        2. NaN表示本来要返回数值却没有返回数值,如任何数除以0都会返回NaN。通过isNaN()判断某个值是不是NaN。注意NaN并不等于NaN。isNaN(NaN)返回true。isNaN(true)返回false。isNaN(‘blue’)返回true。因为他不能将blue转换成数值。默认isNaN里的参数会调用valueOf()方法。
      • 数值转换:
        1. 进行数值转换的三个方法分别是Number()/parseInt()/parseFloat(),Number转换任意类型,后两者用于转换字符串。
          • Number() 方法转换规则:

            1. true、false转换成1、0
            2. null转换成0
            3. undefined转换成NaN
            4. 字符串:数值字符串转换成相对应的Number,’'转换成0,非空字符串且非数值字符串转换成NaN,对象则调用valueOf()方法的值转换然后进行转换,如果返回NaN,在调用toString()方法得到最后值。
          • parseInt()方法解析非数值字符串会返回NaN,包括空字符串。当解析数值是会忽略前导零,当解析过程中有非数字存在则返回前面的数,如parseInt(222.33)/parseInt(222blue)都会解析成222.

          • parseFloat()与parseInt()不同的是parseFloat只能解析十进制。典型事例如下:

              var num1 = parseFloat("1234blue"); //1234 (整数
              var num2 = parseFloat("0xA"); //0
              var num3 = parseFloat("22.5"); //22.5
              var num4 = parseFloat("22.34.5"); //22.34
              var num5 = parseFloat("0908.5"); //908.5
              var num6 = parseFloat("3.125e7"); //31250000
            
    • String类型:转移序列、字符串特点、转化为字符串。
      1. 转移序列包括\r,\n,\t等可以包含在字符串中。

      2. 字符串特点即字符串一旦被创建即不可更改,如

         var str = 'java'
         str = str + 'script'  //重新创建容纳十个字符的字符串
        
      3. 除了null,undefined其他值都有toString()方法,且toString(2)方法可以指定基数将某一数值类型转换成二、八、十六进制。如果不知道该值是不是null、undefined可以用String()方法转换成字符串。

    • Object类型:数据与功能的集合,object对象是所有js对象的基础,即该对象拥有的所有属性与方法会具体到JS的每个对象。如下方法:
      1. constructor():构造函数,比如new Object()Object()为构造函数。

      2. hasOwnProperty(),用法如o.hasOwnProperty(name)判断对象o中是否有name属性。

      3. isPrototypeOf(object)判断某对象是否是object对象的原型,原型后续介绍。

      4. o.propertyIsEnumerable(propertyName)判断o对象的propertyName属性是否可以枚举,即是否可以进行for循环。

      5. toLocaleString():返回对象的字符串表示,该字符串与执行环境的地区对应。

      6. toString():返回对象的字符串表示。

      7. valueOf():返回对象的字符串、数值或布尔值表示。通常与 toString()方法的返回值
        相同。

        注意:ECMAScript定义的对象并不一定适用于宿主对象,比如拓展的BOM、DOM中的对象

1.6 操作符

  1. 一元操作符:只能操作一个值

    • 递增、递减操作符,如例子:

        var age = 23
        var age1 = ++age +2
        alert(age) //24 
        alert(age1) //26 先执行自增,后执行+2,
      

    对于++/–操作符,++age/age++不同点在于前者先自增在进行运算,后者先运算在执行自增,–age/age–亦相同。

    • 一元加减操作符,会尝试对变量进行数值转换:

        var s1 = "01";
        var s2 = "1.1";
        var s3 = "z";
        var b = false;
        var f = 1.1;
        var o = {
         valueOf: function() {
         return -1;
         }
        };
        s1 = +s1; // 值变成数值 1
        s2 = +s2; // 值变成数值 1.1
        s3 = +s3; // 值变成 NaN
        b = +b; // 值变成数值 0
        f = +f; // 值未变,仍然是 1.1
        o = +o; // 值变成数值-1 
      
    • 一元减操作符,使转换得到的变量变成负数,

  2. 布尔操作符

    1. 逻辑非:! 可以将任何数据类型的值转换成布尔值,如:

       alert(!false); // true
       alert(!"blue"); // false
       alert(!0); // true
       alert(!NaN); // true
       alert(!""); // true
       alert(!12345); // false 
      
    2. 逻辑与:&& 有如下注意项:

      • 存在短路操作,即当第一个操作数为false的情况下不会判断第二个操作数。
      • 不可以操作为声明过的变量。
      • 当有一个操作数不是布尔值的情况下不一定返回布尔值,具体规则如下:
        • 如果第一个操作数是对象,则返回第二个操作数;
        • 如果第二个操作数是对象,则只有在第一个操作数的求值结果为 true 的情况下才会返回该对象
        • 如果两个操作数都是对象,则返回第二个操作数;
        • 如果有一个操作数是 null,则返回 null;
        • 如果有一个操作数是 NaN,则返回 NaN;
        • 如果有一个操作数是 undefined,则返回 undefined。
    3. 逻辑或:||,注意事项如下:

      • 如果第一个操作数是对象,则返回第一个操作数;
      • 如果第一个操作数的求值结果为 false,则返回第二个操作数;
      • 如果两个操作数都是对象,则返回第一个操作数;
      • 如果两个操作数都是 null,则返回 null;
      • 如果两个操作数都是 NaN,则返回 NaN;
      • 如果两个操作数都是 undefined,则返回 undefined。
  3. **乘性运算符:**包括乘(*),除(/),求余(%)运算符,运算时会使用Number()转型成数值进行计算。

  4. 加性运算符需要注意的是,如果两个操作数有一个是字符串,则会将两个字符串拼接起来,如果对于对象执行+,则会调用对象的toString()方法,根据所得到的结果进行字符串拼接。对于减法则会对不同类型的数据进行转换,然后进行操作。

  5. 关系操作符、相等操作符、条件操作符、赋值操作符、逗号操作符

    1. 关系操作符相关规则:
      1. 如果两个操作数都是数值,则执行数值比较。
      2. 如果两个操作数都是字符串,则比较两个字符串对应的字符编码值。
      3. 如果一个操作数是数值,则将另一个操作数转换为一个数值,然后执行数值比较。
      4. 如果一个操作数是对象,则调用这个对象的 valueOf()方法,用得到的结果按照前面的规则执行比较。如果对象没有 valueOf()方法,则调用 toString()方法,并用得到的结果根据前面的规则执行比较。
      5. 如果一个操作数是布尔值,则先将其转换为数值,然后再执行比较。
    2. 相等操作符,相等==不相等!==会将操作数进行类型转换在进行比较。
    3. 三目运算符:max = number1 > number2 ? number1 : number2
    4. 赋值运算符:+= -= /= *= %= =
    5. 逗号运算符: 在一条语句中执行多个操作,不常用

1.7 语句

  1. if语句if (condition) statement1 else statement2,condition条件可以不是布尔值,判断是会自动转换。

  2. do-while:语句,代码至少会被执行一次。

     	do{
     		statement
     	}while(condition)
    
  3. while语句:

     var i = 0
     while(i<5){
     	console.log(i)
     }
    
  4. for语句:

     for(var i=1;i<5;i++){
     	console.log(i)
     }
     //无线循环
     for(;;){}
    

    **注意:由于es5不存在块级作用域,则外部也可以访问到变量i的值。

  5. **for-in语句:**当迭代对象的属性

     	for (var name in window){
     		console.log(name)
     	}
    
  6. label、continue、break语句
    label语句用来指定是那一层循环,并且配合continue或者break退出指定循环

     	var num = 0;
     	outermost:
     	for (var i=0; i < 10; i++) {
     	 for (var j=0; j < 10; j++) {
     	 if (i == 5 && j == 5) {
     	 break outermost;
     	 }
     	 num++;
     	 }
     	}
     	alert(num); //55 
    
  7. **with语句:**with 语句的作用是将代码的作用域设置到一个特定的对象中。with 语句的语法如下:

     var qs = location.search.substring(1);
     var hostName = location.hostname;
     var url = location.href; 
     //转换成如下
     with(location){
      var qs = search.substring(1);
      var hostName = hostname;
      var url = href;
     } //严格模式下不支持with语句。大量使用with会导致性能下降
    
  8. switch语句:

     switch (i) {
      case 25:
      /* 合并两种情形 */
      case 35:
      alert("25 or 35");
      break;
      case 45:
      alert("45");
      break;
      default:
      alert("Other");
     } 
    

1.8 函数

  1. 函数声明使用function,如没有指定函数返回值,默认返回undefined
  2. 函数中命名参数可以任意指定,函数体内也可不使用指定的参数,可以通过arguments这一伪数组访问函数执行时调用的参数。
  3. 函数没有重载,即后定义的函数会覆盖先前定义的函数。

1.9 变量、作用域、内存相关问题

基本数据类型,引用数据类型差别
  • 变量访问方式不同,基本数据类型、引用数据类型,前者按值访问,后者与前者定义一致,但后者是按引用访问了,可以动态赋值。

      var obj = new Object()  //为引用数据类型动态赋值
      obj.name = 'scorpion'
      alert(obj.name)
    
  • 变量赋值不同,基本数据类型会开辟新的内存空间存放新值,而引用数据类型则只会复制上一个对象的引用,相当于复制一个指针,而真正存放在内存中的对象不会被独立复制。

  • 传递参数相同,都是按值传递的。

  • 检测类型:typeof不能检测详细的对象类型以及null,他们都返回object,而instanceof用来检测对象类型,用法如result = variable instanceof constructor,注意的是instanceof不能检测基本数据类型,因为基本数据类型不是对象,都统一返回false。

没有块级作用域

如js中的if语句,跟其他语言不同的是,如C、c++ 它们在花括号封闭的代码内都有自己的块级作用域,而语句执行完毕就会被销毁。而js则会把JS中的变量添加到当前的执行环境中。

垃圾收集机制

概括来说js找出不在继续使用的变量释放其内存,垃圾收集器按照固定时间间隔周期性执行操作,垃圾收集器主要会对不再有用的变量打上标记,将来回收用,由于浏览器实现策略不同,主要由以下两种方式:

  • 标记清除:垃圾收集器在运行的时候会给存储在内存中的所有变量都加上标记(当然,可以使用任何标记方式)。然后,它会去掉环境中的变量以及被环境中的变量引用的变量的标记。而在此之后再被加上标记
    的变量将被视为准备删除的变量,原因是环境中的变量已经无法访问到这些变量了。最后,垃圾收集器
    完成内存清除工作,销毁那些带标记的值并回收它们所占用的内存空间。

  • 引用计数:每次对象被引用一次引用计数加一,当引用计数为0时,垃圾收集。会出现循环引用问题,如下代码,引用计数始终为2,不利于垃圾收集。

      var a = new Object()
      var b = new Object()
      a.obj = b
      b.obj = a
    

1.10 引用类型

  1. Object类型:

    • 创建方式:
      • new Object() 或者通过字面量方式{}
    • 访问对象属性:
      • obj.name 或者obj.["name"]
      • 方括号可以通过变量访问,如propertyName = 'name' obj[propertyName]
      • 当属性名字是字符串且有空格时,必须使用方括号访问。如obj['first name']
  2. Array类型

    数组的大小动态改变

    • 创建方式:

      • new Array():创建空数组,new Array(20)创建length长度为20的数组,new Array('red','blue')创建只有两项的数组,
      • 字面量创建:[]/[1,2,3],通过索引获取单个值。
    • length属性的使用:数组的length属性是可读、可写的。举例如下

        var arr = ['red', 'blue', 'green']
        arr.length = 2 //会移除green这一项
        arr.length = 4 //第四项值为undefined
        arr[arr.length] = 'yellow' //从数组末尾添加项
        arr[5] = 'yellow'  //中间4、5项为undefined
      
    • Array.isArray(value)判断value是否是数组

    • 当把一个数组转变成字符串时,会默认调用数组每一项的toString()方法,最后返回以逗号拼接的字符串。 数组的join方法会按指定符号拼接。

        arr = [1,2,3]
        String(arr)  // 1,2,3  调用每一项的toString()方法,返回字符串
        alert(arr)  //alert会把数组转换成字符换
        arr.join('||') //返回1||2||3
      
    • 栈方法:后进先出,push() pop()方法的使用

        arr = []
        var count = arr.push(1,2,3)  //从数组末尾推入三个值,并返回新数组的length大小
        var val = arr.pop() //从数组末尾删除一个值,返回删除那个值
      
    • 队列方法: 先进先出,unshift() shift()

        arr = []
        var count = arr.unshift('1,2,3') //从头部添加三项,返回新数组的长度
        var item = arr.shift() //从头部删除一项,并返回删除的值。
      
    • 重排序方法:reverse() sort(),两种方法会直接修改原数组。

        arr = [1,2,3,4]
        arr.reverse() //arr变成[4,3,2,1]
        arr1 = [1,5,10,15]
        arr1.sort()  //arr1变成[1,10,15,5],sort()会将每一项调用toString()方法,然后进行排序。
        sort()方法可以接受一个比较函数如下:
        function compare(v1, v2){
        	return v1 - v2}  //升序, v2-v1 降序
      
    • 操作方法:

      • concat方法

          arr = [1,2]
          arr1 = arr.concat(3,[4,5]) //concat()方法合并原有数组,可接受单个数组,也可接受序列,但只会把每项值合并成一个新数组。
        
      • slice()方法,

          arr = [1,2,3,4,5]
          arr1 = arr.slice(1,3) //返回2,3。不包括3的索引值
          arr2 = arr.slice(2) //返回345
          arr3 = arr.slice(-1) //负号索引当做如 -1+arr.length 取的值
        
      • splice(start,deleteNums,items)方法:用于删除,添加、替换数组

          arr = [1,2,3,4,5]
          arr.splice(2,2)  //以索引为2处删除两项,arr变成[1,2,5]
          arr2 = [1,2,3,4,5]
          arr.splice(2,0,1.5,1.6) //在索引为2处添加1.5,1.6。arr2变成[1, 2, 1.5, 1.6, 3, 4, 5]
        
    • 位置方法:indexOf()/lastIndexOf(),lastIndexOf从后往前查找。

        	arr = [1,2,3]
        	index = arr.indexOf(2) //值为2的项索引是多少,index为1
      
    • 迭代方法:every()some()两个方法返回布尔值,filter()方法根据返回true的项组成的数组,map()方法返回数组,forEach()方法无返回值

        arr = [1,2,3,4,5,6,7,8]
        arr1 = arr.every(function(item, index,arr){return item>2})//如果所有的项都大于2,返回true。
      
        arr2 = arr.some(function(item,index,arr){return itme>2}) //如果有一项大于2就返回true
      
        arr3 = arr.filter(function(item){return item > 2}) //返回item>2为true的项,所以arr2的值是[3,4,5,6,7,8]
      
        arr4 = arr.map(function(item){return item * 2})  //arr4的值是每一项乘以2的值。
      
        arr.forEach(function(item,val,arr){/*执行操作*/}) //没有返回值
      
    • 归并方法:reduce()``reduceRight()方法,

        arr = [1,2,3,4,5]
        var sum = arr.reduce(function(pre, cur, index, arr){return pre + cur})
        //第一次回调,pre 为第一项的值,cur为第二项的值,
        //第二次回调,pre为第一次回调的return值,cur,为第三项的值,以此类推求累加。
      
  3. Date类型:

    详情介绍

  4. RegExp 类型:

    • 创建方式以及区别:

      1. 字面量表示:pattern1 = /\[bc\]at/i;

      2. 创建对象: pattern2 = new RegExp("\\[bc\\]at", "i");

        元字符:( [ { \ ^ $ | ) ? * + .]}
        如果想在正则中使用必须进行转义。如果是通过RegExp对象创建的,则要进行双重转义,为了区别普通字符串转义和正则字符串的转义。

    • **实例属性:**正则对象拥有以下实力属性。

        var pattern1 = /\[bc\]at/i;
        alert(pattern1.global); //false
        alert(pattern1.ignoreCase); //true
        alert(pattern1.multiline); //false
        alert(pattern1.lastIndex); //0
        alert(pattern1.source); //"\[bc\]at"
        var pattern2 = new RegExp("\\[bc\\]at", "i");
        alert(pattern2.global); //false
        alert(pattern2.ignoreCase); //true
        alert(pattern2.multiline); //false
        alert(pattern2.lastIndex); //0
        alert(pattern2.source); //"\[bc\]at" 
      
    • 实例方法:

      • test()方法返回布尔值,用法如下:

          var text = "000-00-0000";
          var pattern = /\d{3}-\d{2}-\d{4}/;
          if (pattern.test(text)){
           alert("The pattern was matched.");
          } 
        
      • exec()方法,当匹配到返回数组,没有匹配到返回null。

          var text = "mom and dad and baby";
          var pattern = /mom( and dad( and baby)?)?/gi;
          var matches = pattern.exec(text);
          alert(matches.index); // 0
          alert(matches.input); // "mom and dad and baby"
          alert(matches[0]); // "mom and dad and baby"
          alert(matches[1]); // " and dad and baby"
          alert(matches[2]); // " and baby" 
        

        补充:String的match方法也会更具正则匹配,如 String.match(pattern)

    • 实例属性:

      • input $_ 最近一次要匹配的字符串。Opera未实现此属性

      • lastMatch $& 最近一次的匹配项。Opera未实现此属性

      • lastParen $+ 最近一次匹配的捕获组。Opera未实现此属性

      • leftContext $` input字符串中lastMatch之前的文本

      • multiline $* 布尔值,表示是否所有表达式都使用多行模式。IE和Opera未实现此属性

      • rightContext $’ Input字符串中lastMatch之后的文本

        var text = “this has been a short summer”;
        var pattern = /(.)hort/g;
        if (pattern.test(text)){
        alert(RegExp.input); // this has been a short summer
        alert(RegExp.leftContext); // this has been a
        alert(RegExp.rightContext); // summer
        alert(RegExp.lastMatch); // short
        alert(RegExp.lastParen); // s
        alert(RegExp.multiline); // false
        }

  5. **Function类型:**函数也是对象,函数名相当于对象的引用。并且函数没有重载这一概念,即后声明的函数会覆盖前面名字相同的函数。

    1. 函数声明与函数表达式:
      函数声明存在函数提升,通过例子说明:

       alert(sum(10,10)); //函数正常执行
       function sum(num1, num2){
        return num1 + num2;
       } 
       alert(sum(10,10)); //函数表达式不存在函数提升,报错
       var sum = function(num1, num2){
        return num1 + num2;
       }; 
      
    2. 函数内部属性:
      1.argument类数组,保存传递进来的函数参数,argument还有一个属性是callee,该属性是一个指针,指向拥有argument的函数。如下面例子传变成使用callee:

       	function factorial(num){
       		 if (num <=1) {
       		 return 1;
       		 } else {
       		 return num * factorial(num-1)
       		 }
       		} 
      
       	function factorial(num){
       	 if (num <=1) {
       	 return 1;
       	 } else {
       	 return num * argument.callee(num-1)
       	 }
       	} 
      
      1. this,始终指向当前函数执行的作用域。

         window.color = "red";
         var o = { color: "blue" };
         function sayColor(){
          alert(this.color);
         }
         sayColor(); //"red" 全局环境中执行作用域为window
         o.sayColor = sayColor;//动态的为函数添加属性。
         o.sayColor(); //"blue",this作用域指向变成了o这个对象
        
      2. caller保存调用当前函数的函数的引用,即是外层函数的引用,例子阐述caller使用。调用时不能直接在函数中直接调用caller,需要以函数名.caller。全局环境下caller为null。

         function inner(){alert(argument.callee.caller)}
         function outer(){inner()}
         outer()
        

      注意:在严格模式下访问callee、caller属性会出错

    3. 函数的属性和方法:

      1. length属性,用来表示形式参数的个数。

         function ar(name,wdf){console.log(ar.length)}
         ar()  //即使调用时不传递参数length值也为2
        
      2. prototype属性用来保存对象的实例方法,不可枚举,即不能用for-in循环遍历。实现继承关系最重要的一个属性,后面会详细讲述。

      3. 两个非继承而来的实例方法,call() apply():在特定的作用域函数,相当于改变了函数内部属性this的值。

         color = 'red'
         obj = {color: 'blue'}
         function test(){alert(this.color)}
         test.call(obj)  //把函数的执行环境变成obj,则打印的color值为blue
         test.call(this) //color为red
         // 在此处call和apply两个方法都可以混用,唯一区别是call方法后面传递的参数是序列,而apply方法后面第二个参数只能用数组传递给函数参数。
        
      4. bind()方法也可以改变函数执行作用域,它能够创建一个函数实例返回,执行是在绑定的那个作用域中:

         window.color = "red";
         var o = { color: "blue" };
         function sayColor(){
          alert(this.color);
         }
         var objectSayColor = sayColor.bind(o);
         objectSayColor(); //blue 
        
  6. **基本包装类:**Boolean、Number、String

    由于基本数据类型不是对象,理应没有实例方法。如下例子,它确实可以调用subString方法。这是因为后台会调用它的基本包装类创建一个实例对象,使它拥有String对象的方法。

     	str = 'abcde'
     	str1 = str.subString(2)
     	alert(str1)
    

    基本包装类型与引用类型的区别就在于可以为引用类型动态赋予属性,而基本包装类型不可以,因为基本包装类型在创建时执行完相关的实例方法就被销毁了,而引用类型则会在整个执行流执行完毕才会被回收。

    注意:尽量不要显示使用基本包装类型,如var str = new String('jlljk')

    1. Boolean类型:
      基本数据类型boolean值与包装类Boolean创建的对象区别:

      • 在进行布尔逻辑运算时使用包装类创建的对象有差别,如new Boolean(false) && true会返回true,这是因为在进行布尔逻辑运算时,任何飞空对象都会转变成true

      • 使用typeof方法辨别类型时会有不同:

          typeof true //返回boolean
          typeof new Boolean(true) //返回object
        
      • 使用instanceof会有所不同:

          true instanceof Boolean  //返回false
          new Boolean(true)instanceof Boolean  //返回true
        
    2. Number包装类型:

      • 相关方法

          num = 10.234
          num.toString(8)  //指定基数,表示转换成多少进制的字符串
          num.toFixed(2)  //保留几位小数,四舍五入特性。
          num.num.toExponential(1); //"1.0e+1",转变成科学计数
        
      • 与基本类型的不同:
        1.使用typeof的不同,一个返回number,一个返回object
        2.使用instanceof的不同,与上述Boolean相似

    3. String包装类型:

      方法介绍

      1. charAt()接受一字符串的索引值,用法如下

         var str = 'abcd'
         str.charAt(1)  //返回b这一字符,下面对比charCodeAt()方法,该方法返回索引是1的ASCII编码。
         str.charCodeAt(1) //返回98
        
      2. 拼接字符串相关方法:

        • concat(),类似字符串+操作

        以下方法都会对字符串进行切面处理,但又不同点

        • subStr(),第二个参数为字符个数,可识别负数。
        • slice(),切面方法,可以识别负数
        • subString()第一、二个参数都是索引,不能识别负数,自动转换成0
      3. 字符串位置方法,indexOf(),lastIndexOf()获取字符串总某个字符的索引。 如果找不到该字符存在的位置,返回-1.

         str = 'abcd'
         str.indexOf('a') //返回0
        
      4. trim()方法。

         str = '   jkj'
         str = str.trim() //去多余空白符
        
      5. 大小写转化方法

        1. toLowerCase(),toUpperCase(),将字符转换成大写或者小写。
      6. 字符匹配相关方法

        1. match(),该方法接受正则对象,使用方法与正则对象的exec()方法类似。
        2. search(),与match方法接受的参数一致,但返回的是匹配到该字符串的索引
        3. replace(),第一个参数是要替换的字符串,可以用正则表示,第二个参数是新字符串
      7. fromCharCode()静态方法,接受序列参数,
        使用方式

         String.formCharCode(33,44,55)//返回改ASCII编码的字符串。
        

1.11 单体内置对象

  1. global对象,即不同解析JS环境用不同的global对象,浏览器环境下是window,node环境下就是global对象。isNaN,isFinite(),parseInt(),parseFloat()等都是window对象下方法。

    1. encodeURI(),decodeURI(),只能对含有空格的URI进行编码或者接码。
    2. encodeComponentURI(),decodeComponentURI()可以对所有非字母数字进行编码接码。
  2. Math方法

    1. Math.max() Math.min() 方法接受数字数组,从中获取最大值或者最小值。

    2. 舍入相关方法。

       alert(Math.ceil(25.9)); //26,向上舍入
       alert(Math.ceil(25.5)); //26
       alert(Math.ceil(25.1)); //26
       alert(Math.round(25.9)); //26,标准舍入
       alert(Math.round(25.5)); //26
       alert(Math.round(25.1)); //25
       
       alert(Math.floor(25.9)); //25,向下舍入
       alert(Math.floor(25.5)); //25
       alert(Math.floor(25.1)); //25 
      
    3. Math.random() //获取0到1之间的随机数

       值 = Math.floor(Math.random() * 可能值的总数 + 第一个可能的值) 
       var num = Math.floor(Math.random() * 10 + 1);  、//1到10之间的随机数,包括10
      
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值