zoukankan      html  css  js  c++  java
  • 04、js-基础

     1 """
     2 ECMAjavascript
     3 
     4 ECMAjavascript5 -- es5
     5 
     6 ECMAjavascript6 -- es6
     7 
     8 ECMAjavascript 三部分
     9 
    10 """

    一、javascript引入方式

    """
    方式1:script标签中写js代码
        <script>
            js代码
        </script>
    方式2:创建.js结尾的文件,写js代码,通过script标签的src属性来引入
        <script src="xx.js"></script>
    
    建议放到body标签下面
    """

    二、变量

    // 声明变量时 可以不用var. 如果不用var 那么它是全局变量.
    // 变量命名,首字符只能是字母,下划线,$符,区分大小写
    var a = 10; 声明变量
    var b;   只声明没有赋值,默认值为undefined

    三、数据类型

    1、数值类型

    // number类型
    var a = 11;
    var b = 11.11;
    typeof a; number
    typeof b; number
    // + - * / % 都行,没有取整

    2、字符串

    var s = '欣慰';
    typeof s;  //"string"
    
    //索引取值:s[0]; s.charAt(1);
    /切片: s.substring(起始值,结束值); 都是索引值
    /移除两端空格:
    var a = '  hello  ';
    a.trim(); 
    a.trimLeft();
    a.trimRight();

    3、布尔类型

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    
    </head>
    <body>
    
    <script>
    
        console.log(true);
        console.log(false);
        var y=1;
        if(1){
            y = y+1;
            alert(y)
        }
        else {
            y = y-1;
            alert(y)
        }
    </script>
    
    </body>
    </html>

    4、undefined和null类型

    """
    Undefined: 
        类型只有一个值,即 undefined。当声明的变量未初始化时,
        该变量的默认值是 undefined。
    
        当函数无明确返回值时,返回的也是值 "undefined";
    null: 
        变量不用了,就可以给变量赋值为null,--- object类型
    """

    四、数组

    var names = [11,22,33];
    //数组常用方法:
    
    names[0]                                         //索引,索引也是从0开始的
    //尾部追加移除
    names.push(ele)                               // 尾部追加元素
        //示例:a.push('xx'); --  [11, 22, 33, "xx
    var ele = names.obj.pop()                // 尾部移除一个元素
        //示例:a.pop(); -- [11, 22, 33]
    
    //头部插入移除
    names.unshift(ele)                      // 头部插入元素
        //示例:a.unshift('ssss'); --  ["ssss", 11, 22, 33]
    var ele = obj.shift()                             // 头部移除一个元素
        //示例:a.shift(); --  [11, 22, 33]
    
    names.splice(index,0,ele)                 // 在指定索引位置插入元素
    //names.splice(从哪删(索引),删几个(个数),删除位置替换的新元素(可不写,可写多个)) 
    names.splice(index,1,ele)                  // 指定索引位置替换元素
    names.splice(index,1)                      // 指定位置删除元素
        //示例: a.splice(1,2) --  [11, 22, 33]
            a.splice(1,1,'xx','oo','asdf'); -- [11, "xx", "oo", "asdf", 33]
    //切片
    names.slice(start,end)                      // 切片
        //示例:a.slice(1,3);--  [22, 33]
    
    
    names.reverse()                            // 原数组反转
        //示例:a.reverse(); -- [44, 33, 22, 11]
    
    names.join(sep)                             // 将数组元素连接起来以构建一个字符串
        //示例: var a = ['ni','hao','ma',18]
            //a.join('+'); -- "ni+hao+ma+18"
    
    
    names.concat(val,..)              // 连接数组
        //示例: var a = [11,22]; var b = ['aa','bb']
        //var c = a.concat(b); c -- [11, 22, "aa", "bb"]
    names.sort()                             // 对原数组进行排序
        //很尬!
        //需要自己定义规则:
            function compare(a,b){
               return a - b;  当大于0时,两个数据换位置
            };
            //使用: a.sort(compare); 升序排列

    五、自定义对象类型

    // 声明
    info = {
        name:'武沛齐',
        "age":18
    }
    
    var a = {username:'xx',password:'123'}; //可以不加引号
    typeof info;
    "object"
    
    // 常用方法
    var val = info['name']        // 获取,通过键取值必须加引号,
    info.name 也是可以的
    info['age'] = 20            // 修改
    info['gender'] = 'male'        // 新增
    delete info['age']            // 删除

    创建对象:

    var a = new String('ss')
    typeof a; 'object'

    六、流程控制

     var a = 0;
        if(a > 1){
            console.log('1111');
            // var hhhh = document.getElementById('d1');
            // hhhh.innerText = '彭于晏';
        }else if(a<1){
    
            console.log('2222');
        }else {
            console.log('3333');
        }

    七、运算符

    1、比较运算符

    // > < == !=  >=  <=   ===  !==
    
    var a = 2;
    var b = '2';
    a == b;  true  弱等于
    a === b;  false  强等于
    a != b;  false
    a !== b;   true

    2、算数运算符

    // +  -  * / %   ++  --  
    // ++ 自增 1  
    // -- 自减 1
    
    var a = 2;
    // a++  先执行逻辑  在+1
    // ++a  先+1 在执行逻辑
    
    // 简单示例:
    if (++a === 4){
        console.log('xxx');
    }
    else{
        console.log('ooo');
    };

    八、循环

    1、for循环

    // 循环数组
    // 方式1:
    for (var i in a){
        console.log(i,a[i]);
    }
    // 方式2
    for (var i=0;i<a.length;i++){
        console.log(i,a[i]);
    }
    
    
    for (var i=0;i<10;i++){
        console.log(i);
    }
    
    // 循环自定义对象
    var d = {name:'chao', age:18};
    for (var i in d){
        console.log(i,d[i]);
    }
    //不能用下面的属性取值的方法
    for (var i in d){
        console.log(i,d.i);
    }

    2、while循环

    var a = 0;
    undefined
    while (a < 10){
        console.log(a);
        a++;
    }

    九、函数

    1、普通函数

    function f1(a,b){
        return a+b;
    }
    // 执行: f1(1,2) -- 3
    function f1(a,b){
        return a,b;
    };
    
    // f1(1,2);
    // 不能返回多个值:  2

    2、匿名函数

    var a = function (a,b){
        console.log('xxx');
    }
    
    var d = {'xx':'oo','f':function (a,b){
        console.log('xxx');
    }};
    // 执行:d.f(1,2);

    3、自执行函数

    (function () {
            alert('自执行函数!')
    })()

     十、json序列化

    import json
    // JSON
    var d_json = JSON.stringify(d);  // 序列化
    var xx = JSON.parse(d_json);     // 反序列化
  • 相关阅读:
    福大软工 · 第七次作业
    福大软工 · 第八次作业(课堂实战)- 项目UML设计(团队)
    福大软工1816 · 第六次作业
    福大软工1816 · 第四次作业
    福大软工1816 · 第三次作业
    测试用例设计--黑盒测试、白盒测试
    数据库测试概述
    层次数据库与网状数据库
    ER图转换关系模型
    事务、锁
  • 原文地址:https://www.cnblogs.com/kongxiangqun/p/13622367.html
Copyright © 2011-2022 走看看