【JavaScript】与众不同数据篇

简介: JavaScript常见的函数



一、前言

进入正题,该说不说

二、变量的种类

①全局变量:

在画数体之外声明的变量属于全局变量,全局变量的生命周期是:

浏览器打开时声明,浏览器关闭时销毁,尽量少用,因为全局变量会一直在浏览器的内存当中,耗费内存空间。所以尽量使用局部变量

②局部变量:

在函数体当中声明的变量。包括一个函数的形参都属于局部变量

局部变量的生命周期是:函数开始执行时局部变量的内存空间开辟,函数执行结束之后,局部变量的内存空间释放。

这和java中的基本一致。

<!doctype html>
<html>
   <meta  charset="utf-8">
   <head>
      <title></title>
   </head>
   <body>
      <script  type="text/javascript">
        var play=100;
        function player(){
          var play="张三";
           alert(play);
        }
        player();//调用
        alert(play);
      </script>
   </body>
</html>>

image.gif

如果一个变量没有var修饰那他就是全局变量,和他所在的位置无关。

如:

<script  type="text/javascript">
        function player(){
            play="张三";//变量要赋值
        }
        player();//调用
        alert(play);
      </script>

image.gif

image.gif

若是加上var修饰则,则定义在函数体内的变量则无法访问,因为他已经销毁了。

两个相同的变量和作用范围(都是全局或都是局部变量),后出现的会覆盖先出现的变量,因为执行顺序是自上而下的。

三、js中的数据类型

虽然js在声明的时候不需要指定类型,但是每个值还是有类型的。

分为:原始类型和引用类型

原始类型:Undefined、Number、String、boolean、Null

引用类型:Object和object的子类

ES规范(ECMAScript规范):在ES6之后又在数据类型上面增加了叫Symbol的数据类型

四、typeof运算符

js中有一种运算符为typeof,这个运算符可以在程序执行过程中动态的获取变量的数据类型

typeof运算符的语法格式:

typeof  变量名

typeof运算符的运算结果是以下6个字符串之一:(注意字符串都是全部小写)

    • "undefined"
    • "number"
    • "string"
    • "boolearl"
    • "object"
    • "function"

    在js中比较字符串是否相等用"=="来完成,js中没有equals。

    例:,要求a变量和b变量将来的数据类型必须是数字,不能是其他类型。

    以下定义的这个sum函效是为了完成两个数字的求和。

    <script type="text/javascript">
    function sum(a,b){
       if(typeof a=="number"&& typeof b=="number"){
          return a+b;
        }
       alert("a或b中有一个或两个不是数字");
    }
     var rel=sum(false,"ab");
      alert(rel);//undefined,因为不符合要求所以没收到返回值,故默认是undefined
      var  ral=sum(1,3);
      alert(ral);//4
    </script>

    image.gif

    typeof数据类型小测试:

    var i;
    alert(typeof i);//undefined
    var n=100;
    alert(typeof n);//number
    var s="abcd";
    alert(typeof s);//string
    var c=null;
    alert(typeof i);//object,null属于Null类型,单typeof运算结果是object
    var k=false;
    alert(typeof i);//boolean
    function su(){
    }
    alert(typeof su);//function

    image.gif

    五、原始类型:

    1.Undefined

    Undefined类型只有一个值,这个值就是undefined的,当一个变量没有赋初值,系统就会给这个变量赋为undefined,undefined是一个具体的值。

    例:

    <script type="text/javascript">
      var a;
      var b=undefined;
      var c="undefined";//带""是字符串了
      alert((a==b)+","+(a==c));
    </script>

    image.gif

    运行结果:

    image.gif

    2. Number

    number包括整数、小数、负数、正数、不是数字、无穷大(10,3.14,-5,10,NaN,Infinity)都属于Number类型。

    关于NaN表示Not a  Number,不是一个数字,但是属于Number类型

    什么时候结果是一个NaN呢?

    运算结果本来应给是一个数字,但最后算完不是一个数字,结果就是NaN

    如:

    var i=100;
    var h="块";
    alert(i/h);//数字参与除法本来应该是一个数字,但是现在不会得到一个数字,所以结果是NaN

    image.gif

    image.gif

    但是有字符串相加时,会进行字符串拼接,不会参与加号运算,故结果也就不会是NaN

    Infinity表示无穷大(当除数为0时,结果为无穷大)

    var i=100;
    var h=0;
    alert(i/h);//(当除数为0时,结果为无穷大)Infinity

    image.gif

    image.gif

    alert(10/3);

    image.gif

    结果为3.3333333...

    在js中两个数相除,会算尽

    常见的函数:

    isNaN

    判断不是一个数字,如果是数字返回false,否则true。

    alert(isNaN(100));//false是一个数字
    alert(isNaN("100"));//true不是一个数字

    image.gif

    parseInt

    将字符串转化为数字,并且取整数位。

    alert(parseInt("3.667"));//3
    alert(parseInt(5));//5不变

    image.gif

    parseFloat

    将字符串转化为数字

    alert(parseFloat("3.14"));//3.14
    alert(parseFloat(5.44));//5.44

    image.gif

    Math.ceil():

    将一个小数向上取整(如:2.1->3,Math是一个数学类,ceil表示天花板)(向大的整数靠近)

    alert(Math.ceil(2.1));//3
    alert(Math.ceil(-2.1));//-2

    image.gif

    4.Boolean

    在js中布尔类型只有两个值,false和true.

    Boolean类型终有一个函数:boolean();

    语法格式为:boolean(数据)

    在其他需要布尔类型是,直接写数据,js会自动调用boolean()函数。有数据会转化成true,没数据转化成false。

    如:

     

    alert(Boolean(1));//true
    alert(Boolean(0));// false
    alert(Boolean(""));// false
    alert(Boolean("abc"));// true
    alert(Boolean(null)):// false
    alert(Boolean(NaN));//false
    alert(Boolean(undefined));// false
    alert(Boolean(Infinity));// true
    //有数据会转化成true,没数据转化成false。

    image.gif

    如:

    var kc="kong";
    if(kc){
     alert("hello"+kc);
    }else{
      alert("数据为空") ;
     }

    image.gif

    结果:

    image.gif

    五、 Null

    Null只有一个值null

    <script type="text/javascript">
       alert(typeof null);//object
    </script>

    image.gif

    六、String

    String类型:

    1、在JS当中字符串可以使用单引号。也可以使用双引号。

    var s1='abcdef';
    var s2="test";

    image.gif

    2、在JS当中,有两种方式创建字符串对象


    第一种:

    var  s="abc";

    image.gif

    第二种(使用Js内置的支持类String):

    var  s2=new String("abc");

    image.gif

    需要注意的是:String是一个内置的类,可以直接用,String的父类是object。

    3、无论小string还是大String,他们的属性和函数都是通用的。


    ①小string(属于原始类型string)

    var x="king";
    alert(typeof x); // "string"

    image.gif

    ②大String(属于Object类型)

    var y=new String("abc");
    alert(typeof y);// "object"

    image.gif

    获取字符串的长度的函数

    <script type="text/javascript">
       var x="king";
    var y=new String("abc");
    alert("x的长度"+x.length+",y的长度"+y.length);//3,4
    </script>

    image.gif

    结果

    image.gif

    常用函数

      • indexOf             获取指定字符串在当前字符串中第一次出现处的索引    
      • lastIndexOf     获取指定字符串在当前字符串中最后一次出现处的索引    
      • replace             替换  
      • substr             截取子字符串  
      • substring         截取子字符串    
      • toLowerCase   转换小写  
      • toUpperCase    转换大写    
      • spIit                   拆分字符串

      indexOf   & lastIndexOf

      alert('abcda'.indexOf("b"));//1
      alert('abcb'.lastIndexOf("b"));//3
      alert('abcda'.indexOf("f"));//-1不存在的返回-1

      image.gif

      replace(只替换了第一个)

      alert("next#int#oser".replace("#","%"))

      image.gif

      image.gif

      在写一个可以再替换一个,其实在原来替换第一个基础上在替换第一个

      alert("next#int#oser".replace("#","%").replace("#","%"))

      image.gif

      image.gif

      想全部替换要使用正则表达式

      考点:经常问 substr和substring的区别?

       

      substr(startIndex,length) 参数是开始的下标和截取总长度

        substring(startIndex,endIndex)参数是开始的下标和结束的下标注意:不包含结束下标

      substr(startIndex,length)
        alert("abcdefxyz".substr(2,4));//cdef
         substring(startIndex,endIndex)注意:不包含endIndex
       alert("abcdefxyz".substring(2,4));//cd

      image.gif

      七、Object

      Object类型:

      1、0bject类型是所有类型的超类,自定义的任何类型,默认继承object。

      2、Obiect类包括哪些属性?

      prototype属性(常用的,主要是这个),作用是给类动态的扩展属性和函数。 constructor属性

      3、Object类包括哪些函数?

      toString() valueOf()

      toLocaleString()

      4、在js当中定义的类默认继承Object,会继承Object类中所有的属性以及函数。换句话说,自己定义的类中也有prototype属性。

      创建类的方式

      js中创建类的方式和创建函数一样。

      方式①

      function 类名(形参){
      }

      image.gif

      方式②

      类名=function(形参){
      }

      image.gif

      创建对象的语法:

      new  类名();

      image.gif

      创建类和函数的方式是一样的,所以在调用上就有区别了

      <script type="text/javascript">
       function hello(){
         alert("hello javascript And kongchao");
       }
       //当成方法
       hello();
      //当成类来创建对象
      var obj=new hello();
      alert(obj);//[object Object]
      </script>

      image.gif

      运行结果:

      图一弹两次窗,图二一次

      在创建类的时候new对象,也得调用一次,所以共两次

      image.gif

      image.gif

       

      JS中的类的定义,同时又是一个构造函数的定义
      在JS中类的定义和构造函数的定义是放在一起来完成的。

      function User(a,b,c){//abc是形参,属于局部变量。
         //声明属性(this表示当前对象)
        // User类中有三个属性:sno/sname/sage 
         this.sno =a;
         this.sname=b;
         this.sage=c;
      }
      //创建对象
      var u1 = new User(111,"zhangsan", 30);
      //访间对象的属性 
      alert(u1.sno);//111
       alert(u1.sname); //zhangsan
      alert(u1.sage);//30
      //访问对象属性的另外一种写法
      alert(u1["sno"]);//111
      alert(u1["sname"]);//zhangsan
      alert(u1["sage"]);//30

      image.gif


      目录
      相关文章
      |
      3月前
      |
      JavaScript 前端开发
      js实现数据的双向绑定
      js实现数据的双向绑定
      118 59
      |
      3月前
      |
      JavaScript 算法 前端开发
      采招网JS逆向:基于AES解密网络数据
      采招网JS逆向:基于AES解密网络数据
      57 0
      |
      7天前
      |
      数据采集 存储 JavaScript
      如何使用Puppeteer和Node.js爬取大学招生数据:入门指南
      本文介绍了如何使用Puppeteer和Node.js爬取大学招生数据,并通过代理IP提升爬取的稳定性和效率。Puppeteer作为一个强大的Node.js库,能够模拟真实浏览器访问,支持JavaScript渲染,适合复杂的爬取任务。文章详细讲解了安装Puppeteer、配置代理IP、实现爬虫代码的步骤,并提供了代码示例。此外,还给出了注意事项和优化建议,帮助读者高效地抓取和分析招生数据。
      如何使用Puppeteer和Node.js爬取大学招生数据:入门指南
      |
      26天前
      |
      前端开发 JavaScript
      JS-数据筛选
      JS-数据筛选
      31 7
      |
      26天前
      |
      JavaScript 数据安全/隐私保护
      2024了,你会使用原生js批量获取表单数据吗
      2024了,你会使用原生js批量获取表单数据吗
      44 4
      |
      2月前
      |
      JavaScript 前端开发 安全
      js逆向实战之烯牛数据请求参数加密和返回数据解密
      【9月更文挑战第20天】在JavaScript逆向工程中,处理烯牛数据的请求参数加密和返回数据解密颇具挑战。本文详细分析了这一过程,包括网络请求监测、代码分析、加密算法推测及解密逻辑研究,并提供了实战步骤,如确定加密入口点、逆向分析算法及模拟加密解密过程。此外,还强调了法律合规性和安全性的重要性,帮助读者合法且安全地进行逆向工程。
      84 11
      |
      1月前
      |
      机器学习/深度学习 JSON JavaScript
      LangChain-21 Text Splitters 内容切分器 支持多种格式 HTML JSON md Code(JS/Py/TS/etc) 进行切分并输出 方便将数据进行结构化后检索
      LangChain-21 Text Splitters 内容切分器 支持多种格式 HTML JSON md Code(JS/Py/TS/etc) 进行切分并输出 方便将数据进行结构化后检索
      22 0
      |
      1月前
      |
      数据采集 JavaScript 前端开发
      JavaScript中通过array.filter()实现数组的数据筛选、数据清洗和链式调用,JS中数组过滤器的使用详解(附实际应用代码)
      JavaScript中通过array.filter()实现数组的数据筛选、数据清洗和链式调用,JS中数组过滤器的使用详解(附实际应用代码)
      |
      2月前
      |
      JSON JavaScript 前端开发
      6-19|Python数据传到JS的方法
      6-19|Python数据传到JS的方法
      |
      3月前
      |
      JSON JavaScript 数据格式
      js实现更新数据
      js实现更新数据
      53 1