JavaScript基础知识

JavaScript 是一种具有面向对象能力的、解释型的程序设计语言。

 作用: 验证发往服务器端的数据、增加 Web 互动、加强用户体验度等。

JavaScript与java之间没有关系:

组成:

          ECMAScript 核心语法

           BOM 浏览器对象模型

            DOM 文档对象模型

使用方式:

               行内js : js代码定义在html元素标签上

              内部js : 通过script标签对定义在html中

             外部js : 定义在外部的一个js文件中,通过script标签引入

注意:一个script标签对只能用要不引入外部js,要不定义内部js代码

位置:

          可以定义在html中的任意位置

        建议:1.head中

                            一目了然,便于后期维护

                             有可能获取不利因素

                    2.body结束之前

                           肯定能够获取到每一个元素

                             不便于观察 

                         

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>js</title>
    <!--内部js-->

    <!--引入外部js-->
    <script src="js/first.js"></script>
</head>
<body>
 <button type="button" onclick="alert('网抑云!!!!')"  id="btn">按钮</button>
    <script>
        console.log("消愁~~~");
        console.log(document.getElementById("btn"));
    </script>
</body>
</html>

2.调试方式

1.alert 弹出框

          最先执行

            不推荐做调试使用

2.document.write("在文档页面中写入内容")

          当页面内容加载完毕之后,再触发document.write的执行,会覆盖原页面

3. console控制台输出  -> 推荐使用

        console.log()

          console.info()

         console.error()

         console.warn()

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>调试方式</title>
</head>
<body>
<button type="button" onclick="document.write('我被他们三个夸我太帅了')">点击按钮</button>
<script>
    alert("泽鹏君");
    alert("郭老贼");
    alert("志康君")
    document.write("他们三个都夸朕帅");

</script>
</body>
</html>

3. 变量

变量没什么好讲的,就是可以先声明再赋值,或者先赋值再声明       var

而且一行中可以通过定义多个变量也可以同时获取多个变量                                                            列如:

var a = 2,b = false, c = "haha";
console.log(a,b,c)

4.数据类型

简单数据类型

   Number 数值型  ---》蓝色

          整数    小数

               NaN not a number

                    (1)直接赋值

                      (2)通过运算无法得到一个正确的结果时  NaN

         String 字符串 -> 黑色

               可以通过一对'',或者一对""定义字符串

                   可以包含0~n个字符

              如果字符串中出现特殊字符,可以通过转义字符进行转义 \

     Boolean 布尔型 -> 蓝色

              true

               false

Null         空->灰色

        1)直接赋值null

        2)获取不到元素得到null

 Undefined 未定义 > 灰色

        1)直接赋值undefined

          2)变量已声明未赋值就为undefined

  Function 函数型

          function 函数名(参数列表){
                    函数体;
                }

复杂数据类型
            对象型 {}
            键值对的集合
            key : value
            每个键值对之间使用,分隔
            键与值之间使用:分隔
            value可以为任意类型的值

5.类型判断

typeof 判断数据类型
            typeof 数据
            typeof(数据)
            返回数据类型的小写字符串表现形式

6.赋值比较

      =   赋值
      ==  是否相等  数据
      === 是否相等  数据+类型
       先比较类型后比较数据值
    
     逻辑运算符
      &&  两个都是真才是真,一个假就是假
        如果两端出现非boolean类型的操作数:
         先把第一个操作数转为boolean.如果为false,最终的结果为第一个操作数,如果为true,结果为              第 二个操作数
    
      ||  一个为真就是真,两个都为假才是假
         如果两端出现非boolean类型的操作数:
          先把第一个操作数转为boolean.如果为true,最终的结果为第一个操作数.如果为false,结果为               第二个操作数
    
       具有短路的特点
       ! 非

7.类型转换

 隐式类型转换 | 自动
            在进行一些其他操作运算的时候,目的不是为了发生类型转换,而在运算过程中会默认自动            发生类型转换,这种类型转换成为隐式类型转换
            一般为四则运算 + - * / ..

          列如:

                 console.log(1+false);
                  console.log(1+'a');
                  console.log(false-'a')

  显示类型转换 | 强制
            任意类型都可以转换为一下三种类型 : String  Number  Boolean
            Number(数据)
            String(数据)
            Boolean(数据)

        注意: 对象类型,函数类型不参与类型转换

Number(数据)

       String
            '' 空串                   -> 0
            ' ' 空格字符串             -> 0
            '123' 纯数字字符串         数字
            '123abc' 非纯数字字符串    NaN

        Boolean
            false       ->0
            true        ->1

        Null                -> 0
        Undefined           -> NaN

 Boolean()
        String
            ''         false
            ' '        true
            其他字符串  true

        Number
             0,NaN      ->false
            非0数字      ->true

        Null            ->false
        Undefined       ->false

7.赋值和数组

赋值:

 =   赋值
      ==  是否相等  数据
     === 是否相等  数据+类型
       先比较类型后比较数据值
    
     逻辑运算符
       &&  两个都是真才是真,一个假就是假
         如果两端出现非boolean类型的操作数:
           先把第一个操作数转为boolean.如果为false,最终的结果为第一个操作数,如果为true,结果为第二个操作数
    
       ||  一个为真就是真,两个都为假才是假
         如果两端出现非boolean类型的操作数:
           先把第一个操作数转为boolean.如果为true,最终的结果为第一个操作数.如果为false,结果为第二个操作数
    
       具有短路的特点
       ! 非

数组:

数组 : 存储多个数据
    可变长,长度根据跟随数据的增删动态的改动
      索引,可以根据索引操作数组中的数据
      数组的索引可以跟随数据的改动进行动态修改
       如果数组存在,索引位置存在,但是没有赋值,默认undefined
       js中的数组中可以存放任意类型的数据
    
      创建方式:
      1.字面量的创建方式 [数据1,数据2...] -> 推荐
       2.new Array() 空数组
       3.new Array(值1,值2...)
    
    
      数组的长度: 数组名.length
      数组的索引 : 从0开始,每次+1
    
    操作数组中的数据:
     跟随索引操作
      数组名[索引值]

8.数组常用方法

数组常用方法:
       slice         截取(切片)数组,原数组不发生变化
             1个参数   起始索引,默认截取到最后
               2个参数   起始索引    结束索引   结束索引位置不包含
        splice        剪接数组,原数组变化,可以实现前后删除效果
             1个参数  起始索引   实现删除与截取的效果
              2个参数  起始索引  删除|截取个数  实现删除与截取的效果
             3个往上  起始索引  个数   从第三个参数开始后面所有的参数为要替换的新数据    替换,截取

9.函数

 函数 : 定义功能的实现
         函数声明 :
           function 函数名(参数列表){
               函数体;
              return 返回值;
           }
        
         函数的调用:
           1)函数名(实参)  -> 执行函数中的代码
           2)把函数声明转为函数表达式进行自调用
               转换方式: 在函数声明的开始位置添加!,~,+,-
        
         函数表达式
           var 变量名 = function 函数名(形参){
        
           };
        
         函数的调用:
           1)变量名(实参);
        2)在函数的最后直接添加()进行自调用
        
        
         注意:
               1.在js中所有的函数都存在返回值,没定义返回值默认undefined
               2.形参与实参可以不一一对象,如果没有对应的实参,形参的默认值undefined
               3.函数表达式中的函数名一般省略不写,不可用来调用函数,只有在发生递归的时候有用

作用域 : 函数
    块: {} 具有语义化的特点

    函数的作用域提升 : 把函数声明方式定义的函数提升到当前作用域的最上面
    变量的作用域提升 : 把通过var定义的变量的变量的声明,提升到当前作用域的最上面

    注意:
      js中的函数可以任意嵌套
 

  • 2
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值