前端js常见面试基础知识整理

1.引入外部js和外部样式css 

  1)<script src="./index.js></script>  //引入外部js

   2)<link rel="stylesheet" href="./index.css> //引入外部样式

     [注意:index.js和index.css的路径均是自己电脑路径且文件名是自己定义的]

2.数据类型转换  (分为显示转换和隐式转换)

  1)显示转换

      parseInt() 只能转换开头是数字的字符串

      parseFloat() 只能转换开头是数字,并且能识别第一个小数点

      tostring()将其他类型转为字符串

      Boolean()转换为布尔类型(非0和非空转化为true,0和null转化为false)

   2)隐式转换

       //字符串+任何其他类型都是字符串---------->因为进行了隐式转换

         1)数值相加,字符相连 console.log('20'+10);//2010

       //如果是减法 乘除转换为数值------------------------>隐式转换

           2)console.log('20'-10);//10

       //容易出现隐式转换为布尔类型 ,比较符号的时候

          console.log(10>5);//false

3.创建数组的两种方式

          1)定义一个数组 var arr=['一点','两点','三点'];

           2)高级的数组创建方式

               var array=new Array();//创建一个空数组

                array[0]='一点';

                array[1]='两点';

                array[2]='三点';

遍历数组

var arr=['blue','yellow','hotpink','skyblue','red'];

for(var i=0;i<arr.length-1;i++){ //for循环遍历

consle.log(arr[i]);

} 

4.对象的基本语法

1)遍历对象

var obj={name:'rao',age:18,sex:'女'}

for(var k in obj){//用for-in遍历对象 

console.log(k);//k为属性名

console.log(obj[k]);//obj[k]为属性值

}

2)遍历json

var user={"name":"raozi","age":"23","hobby":["ai","hao"]};

JSON.stringify(user);//转成字符串格式

var str='{"name":"raozi","age":"23","sex":"男"}'

JSON.parse(str);//转为JSON对象

实际工作中:数据传输的是字符串,在代码中使用的却是对象

 

5.对象Object创建的方法

   1)字面量创建 var user={name:"zhang",age:18,sex:"男",run:function(){console.log("做笔记"}}

   2)new Object方法创建对象

     function person(name,age,sex){

       this.name=name;this.age=age;this.sex=sex;

        this.run=function(){}

     }

     var user2=new person('zhang',18,'男'};

     console.log(user2.name);

6.js内置对象 Math,Array,Date,String

   1)Math对象

      Math.floor();//向下取整    减1

      Math.ceil();//向上取整      加1

     Math.round();//四舍五入,就近取整 注意-3.5是-3

     Math.abs();//绝对值

     Math.max() ;Math.min();//取最大值和最小值

生成0-1之间的随机数 Math.random();//范围 [0,1)

Math.floor(Math.random()*100+1);//[1,100)

随机数万能公式:

Math.floor(Math.random()*(max-min+1)+min)

 

2)Date对象

   var now=new Date('2020-6-28');

   //如果Date()不写参数,就返回当前时间,写参数就返回参数中的值

    now.getTime();//获取毫秒数

    Date常见的方法有:

    getFullYear();//获取当年

    getMonth();//获取当月

    getDate();//获取当天日期

    getDay();//获取星期几

    getHours();//获取小时  getMinutes();//获取分钟

    getsecond();获取当前秒钟

    [注意:月份和星期的取值范围是从0开始的]

 3)Array数组对象

     数组对象的两种创建方式 1.使用new对象创建数组 var arr=new Array(4,5,6);//[4.,5,6]

                                              2.使用字面量的方式创建对象 var arr2=[4,5,6];

    检测是不是数组对象

      arr instanceof Array  ;//判断arr是不是数组对象

 

    数组常用的方法1

        tostring() ;reverse();cancat();indexof();lastIndexof()

     例子1.数组转为字符串 tostring()

         var arr=new Array('魅族','小米','华为','苹果');

         console.log(arr.tostring());

     例子2.将数组倒过来

        console.log(arr.reverse());//['苹果','华为','小米',',魅族']

     例子3.连接数组

        var arr3=[1,2,3];

        console.log(arr3.cancat(arr));//[1,2,3,'魅族','小米','华为','苹果']

     例子4.找到某位置的索引

         var arr4=['a','c','b','d','e','f','b'];

         arr4.indexof('b');//2 找到某位置索引 从前往后找

         arr4.lastIndexof('b');//5 找到某位置的索引 

  

   数组常用方法2

       数组的添加和删除 push() pop() shift() unshift()

       push();//向数组最后添加一个或者多个元素,返回新长度

        例子1: var arr=[1,2,3,4,5];

                    var result=arr.push(6,7,8);//result为8

                    console.log(arr);//[1,2,3,4,5,6,7,8]

          pop();//删除数组最后一个元素,数组长度减1,返回删除元素

                      var arr2=arr.pop();

                       console.log(arr2);//[1,2,3,4]

           shift();//把数组第一个元素删除,数组长度减1,返回删除元素

                     var arr3=arr.shift();

                     console.log(arr3);//[2,3,4,5]

          unshift();//向数组开头添加一个或者多个元素,返回新长度

                       var arr4=arr.unshift(7,8,9);

                        console.log(arr4);//[7,8,9,1,2,3,4,5]

            例子2.数组的排序方法  sort()

                    var arr=new Array(12,10,11,20,30,50,26);

                     arr.sort(function(a,b){

                          return a-b;//升序,反之则为降序

                    })

                  console.log(arr);//[10,11,12,20,26,30,50]

              例子3.数组的删除修改添加  splice() 删除修改添加

                       var arr=new Array('张三','李四','王五','赵六','小七','小八');

                      1) splice(开始位置,删除个数)

                       var delArr=arr.splice(2,2);

                       console.log(arr);//['张三','李四','小七','小八']

                        2)splice(开始位置,删除个数,新添加的元素)

                        arr.splice(2,0,'添加1','添加2');

                        console.log(arr);//['张三','李四','添加1','添加2','王五','赵六','小七','小八']

                       3)splice(开始位置,删除个数,新增元素)

                         arr.aplice(0,2,'修改1','修改2');

                         console.log(arr);//['修改1','修改2','王五','赵六','小七','小八']

            例子4.数组的连接方法 join()  join()不改变原数组,什么不写,默认用,隔开

                        var arr=['zs','ls','ww','zl'];

                        //var result=arr.join(' ');//zslswwzl  //数组转变为字符串

                        var result=arr.join('@');//数组元素用符号连接

                        console.log(result);//zs@ls@ww@zl

         5)string对象

             1.字符串不可变性(值不可变,改变的是地址,新开辟内存空间

                  var str=' ';

                   for(var i=0;i<1000;i++){

                    str+=i;

                   }

                  console.log(str);//解决要花费大量时间来显示,要因为需要不断开辟新空间

                 2.字符串常用方法1

                      var str='今天是个好日子,在房间里面玩电脑'

                       //获取指定位置字符 charAt()

                       console.log(str.charAt(str.length-1));//脑

                      //连接字符 cancat() 等效于+

                      console.log(str,cancat(',','连接');

                     //截取字符串 :substr是抽取字符串一部分,并不会改变原数组

                       console.log(str.substr(0,2));//今天

                       console.log(str);//今天是个好日子,在房间里面玩电脑

                    

                      //找到对应字符串的位置

                         str.indexof('今');//0

                     //(*****)替换字符

                         console.log(str.replace('今','明');//明天是个好日志,在房间里玩电脑

                 3.字符常用方法2

                     //空格也是字符串

                     var str='  华为手机 ';

                    //trim()去掉字符串前后的所有空格

                     console.log(str.trim());//华为手机

                    //大小写的切换

                    var str='AbCdeF';

                     console.log(str.toupperCase());//全部转为大写   ABCDEF

                     console.log(str.lowerCase());//全部转为小写   abcdef

                 //(****) 切割字符串  split()

                    var email='zs@qq.com,lisi@qq.com,wangwu@qq.com';

                    //将切割出来的数据,保存在数组中

                   var emailArr=email.split(',');//['zs@qq.com','lisi@qq.com','wangwu@qq.com']

                    for(var i=0;i<emailArr.length-1;i++){

                     var user=emailArr[i].split('@');

                     console.log(user);//['zs','qq.com] ['lisi','qq.com] ['wangwu','qq.com]

                      }

 网址解析(网址url解析)

 例子:var urlstr='http://127.0.0.0.1/login?username=admin&password=123';

          var user={};//处理存放完后的数据

          var userDate=urlstr.split('?')[1]; //username=admin&passwoed=123;

           var userDate=userDate.split('&');//['user=admin','password=123'];

            for(var i=0;i<userDate.length-1;i++){

               var str=userDate[i].split('=');//['user','admin']   ['password,','123']

                 user[str[0]]=str[i]

              }

              console.log(user);//{username:'admin',password:'123'}