zoukankan      html  css  js  c++  java
  • JavaScript基础

    JavaScript基础

    JavaScript

    1.特点

    • 解释型
    • 弱类型
    • 基于对象
    • 跨平台型
    • 事件驱动

    2.版本

    ECNA:欧洲计算机标准协会

    • ECMAScript3.0
    • ECMAScript5.0
    • ECMAScript6.0(ECMA2015)

    3.应用领域

    • WEB前端(网页)
    • 后端(node.js)
    • 混合APP(IOS,安卓)
    • 游戏

    浏览器中JavaScript的基本语法

    1.在HTML中使用JS

    引入外部的 js 文件。类似于 CSS的link
    <script src="js文件的地址"></script>
    <script src="js文件的地址"></script>
    
    在htm中直接写,包裹在script标签中,类似css的style
    <script>
        code...  js代码
    </script>
    

    2.指令结束符

    ; 或者换行符
    

    3.注释

    单行注释://
    多行注释:/*
                    */
    

    4.输出内容(一般调试用)

    输出到控制台:console.log()
    输出到页面:document.write()
    输出到弹框:alert()
    

    5.定义变量

    var 变量名 = 值;
    * var 关键字
    * 变量名 由数字、字母、下划线、$ 组成 不能数字开头。 变量名不能使关键字
    * 变量名严格区分大小写
    * 变量声明 没给值,默认值是undefined
    

    6.JS程序用到的知识点:

    弹框
    • 警告框:alert('警告'); 无返回值
    • 确认框:confirm('确认'); 返回true/false
    • 输入框:prompt(''); 返回输入的内容,若点取消返回null
    获取页面中的元素作为JS对象

    document.getElementById() #返回元素对象

    • 元素对象与 HTML元素 存在映射关系
    • 元素对象用来描述某个HTML元素
    • HTML元素的属性,会映射成 元素对象的 属性
    获取双标签内的内容

    innerHTML 获取/设置双标签中的内容

    7.定义函数

    function add(){
        // 获取 用户在 input 中输入的内容
    	// 获取元素对象 返回对象 对象描述 id是num1的元素 
        var box1 = document.getElementById('num1');
        var box2 = document.getElementById('num2');
        
        //获取用户在input中输入的值
    
        var inp_num1 = box1.value;
        var inp_num2 = box2.value;
        
        //判断用户输入是否是纯数字
    
        if (isNaN(inp_num1)){
            alert('请输入纯数字');
            return;
        }
        if (isNaN(inp_num2)){
            alert('请输入纯数字');
            return;
        }
        
        //把字符串转换为数字
        var num1 = Number(inp_num1);
        var num2 = Number(inp_num2);
        
        //两个数相加
        var res = num1 + num2;
        
        //获取放结果的div元素 innerHTML 获取或者设置 双标签内的内容
        var boxRes = document.getElementById('box');
        boxRex.innerHTML = res;
    }
    

    JavaScript数据类型

    1.数据类型

    • 原始类型:Number(数字) String(字符串) Boolean(布尔值) Null(空) Undefined(未定义)
    • 对象类型:Object、Array、Date、Math、Error Set(ES6).....

    2.Number

    • js不区分 整型和 浮点型

    • 定义方式

      //十进制
      var num = 100
      //十六进制
      var num = 0x10f
      //科学计数法
      var num = 123e100
      
    • 特殊值 NaN

      NaN跟任何值进行任何运算,结果仍然NaN
      跟谁都不相等,包括自己
      
      一般NaN被动产生(数据类型转为Number,不能转为正常的数字,就是NaN函数 isNaN()  判断是不是NaN或者能不能转换为NaN
      

    3.字符串

    # 单引号
    # 双引号
    # 反引号 模板字符串  ` ` 
    
    单引号 双引号 没有区别
    反引号:
    	多行
    	可以支持中 ${变量} 添加变量
    

    4.布尔值

    true
    false
    

    5.Null与undefined

    被动产生
    

    6.数据类型转换

    • 强制转换
    Number()
    字符串:纯数字转为正常的数字,其他NaN
    布尔值: true->1  false->0
    
    String()
    
    Boolean()
    字符串->布尔: 只有空字符串转为false,其他true
    数字->布尔:  0NaNfalse,其他true
    nullundefined都会转为false
    
    • 自动转换
    根据运算符 做出适当的类型转换
    100 + '20'   数字100自动转换为字符串,得到'10020'
    10*'3'       字符串'3'自动转为数字3,得到30
    

    运算符

    1.算术运算符

    +  加号 正号
    -  减法 负号
    *  
    /
    %
    ++  累加
    --  累减
    

    2.比较运算符

    >
    >=
    <
    <=
    == 相等      两个操作数  只要值相等(类型不同会自动转换) 就相等   
    === 全等     类型和值都要相同才全等
    !=  不得
    !== 不全等
    in 判断 数组的索引 对象的属性 是否存在
    instanceof  一个对象是否属于某个构造函数(类)
    

    3.逻辑运算符

    &&   逻辑与and
    ||   逻辑或or
    逻辑非not
    

    4.位运算符

    &
    |
    ~
    ^
    <<
    >>
    

    5.赋值运算符

    =
    +=
    -=
    *=
    /=
    %=
    

    6.其他运算符

    +   字符串连接符
    ?:  比较运算符    表达式?值1:2
    typeof  判断类型
    delete  删除对象的属性和数组的成员
    void  空运算符
    ,   逗号运算符
  • 相关阅读:
    Queue Aizu
    Stack Aizu
    Stack Aizu
    Shell Sort Aizu
    Shell Sort Aizu
    Stable Sort Aizu
    VS2013下.Net Framework4配置FineUI4.14
    VS2013下.Net Framework4配置FineUI4.14
    Ubuntu-14.04.1 desktop安装时遇到的小问题
    Ubuntu-14.04.1 desktop安装时及安装后遇到的小问题
  • 原文地址:https://www.cnblogs.com/luck-L/p/9444058.html
Copyright © 2011-2022 走看看