• JS基础与循环


    JS 简介

    [JS的三种方式]
    1、HTML标签中内嵌JS
    <button onclick="javascript:alert('白痴')">呵呵呵</button>

    2、HTML页面中直接使用JS
    <script type="text/javascript">
    //JS代码
    </script>

    3、引用外部JS文件
    <script language="JavaScript" src="JS文件路径"></script>


    [注意事项]
    ①页面中JS代码与引用JS代码,可以镶嵌到HTML页面的任何位置。但是位置不同会影响到JS代码的执行顺序;
    例如:<script>在body前面,会在页面加载之前执行JS代码
    ②页面中JS代码,使用type="text/javascript"
    引用外部JS文件使用language="JavaScript"
    ③引用外部JS代码的<script></script>标签,必须成对出现,且标签内不能有任何代码!

    JS中的变量
    1、JS中变量声明的写法
    var width=10;//使用var声明的变量,只能在当前函数作用域有效。
    width=12;//不使用var,直接赋值生成的变量。默认为全家变量,整个JS文件有效
    var a,b,c=1;//同一声明语句同时声明多个变量,变量之间用英文逗号分隔。但赋值需要单独赋值,
    例如上式中只有c=1,a/b未定义[underfined]

    [声明变量注意事项]
    ① JS中所有变量类型声明,均使用var关键字。变量的具体数据类型,取决于给变量赋值的类型
    ② 同一变量可以在多次不同赋值时,修改变量的数据类型:
    var width=10;//width为整形变量
    width="哈哈";//width被改为字符串类型
    ③ 变量可以使用var,也可以省略var。[区别]不使用var,默认为全局变量
    ④ 同一变量名,可以多次var声明。但是并没有任何含义,也不会报错。第二次之后的声明,只会被理解为赋值;

    2、变量的命名规范
    ① 变量名只能有字母/数字/下划线/$组成
    ② 开头不能是数字
    ③ 变量区分大小写,大写字母与小写字母为不同变量

    3、变量名命名要符合驼峰法则:
    变量开头为小写,之后每个单词首字母大写
    或用下划线分割

    4、JS中的变量的数据类型
    Undifined:未定义,用var声明的变量,没有进行初始化赋值。var a;
    Null:代表特殊的变量类型。唯一值为null,表示空的。var a = null;
    boolean:真假,可选值true/false
    Number:数值类型。可以是小数,也可以是整数。
    String:字符串类型。用""或''包裹的内容,成为字符串。
    Object(复杂数据类型):后续讲解,函数、数组等...

    5、常用的数值函数:
    ① isNaN:用于判断一个变量或常亮,是否是NaN(非数值)
    使用isNaN判断时,会尝试使用Number() 函数进行转换,如果能转换为数字,则不是非数值结果为false
    "111"纯数字字符串,false ""空字符串,false "1a"包含其他字符,true
    true/false布尔类型,false
    ② Number():将其他类型转化为数值类型
    [字符串类型转数值]
    >>>字符串为纯数值字符串,会转为对应的数字 "111"->111
    >>>字符串为空字符串时,会转为0 ""->0
    >>>字符串包含其他非字符串时,不能转化 "111a"->NaN

    [布尔boolean类型转数值]
    true->1 false->0

    [null/undefined转数值]
    null->0 undefined->NaN

    [Object类型转数值]
    先调用ValueOf函数,确定函数是否有返回值,再根据上述各种情况判断。

    ③ parsInt:将字符串转为数值类型
    >>>空字符串,不能转。结果为NaN
    >>>纯数字字符串,能转。 "123"->123 "123.5"->123(小数转化时,直接抹掉小数点,不进行四舍五入)
    >>>包含其他字符的字符串,会截取第一个非数值字符前的数值部分。
    "123a45"->123 "a123b45"->NaN
    >>>parsInt只能转string类型,boolean/Null/Undifined均为NaN

    ④ parseFloat:将字符串转为数值
    >>>使用方法同③。但是转换小数时会保留小数点
    "123.5"->123.5

    ⑤typeof:用来检测数据类型
    未定义->Undifined 字符串->string true/false->boolean
    数值->NUmber 对象/null->Object 函数->function

    [JS中的输入/输出语句]
    1、在文档中打印输入:document.write();
    输出语句,将write的()中的内容在浏览器屏幕上:

    使用时注意:除变量/常量意外的任何内容,打印时必须放到""中;变量/常量必须放到""外。
    打印的内容同时有多部分组成的时候,之间用+链接:
    例如:document.write("左手中的纸牌:"+left+"<br/>");

    2、弹窗输出:alert();
    弹窗警告,()中的使用方式,同上

    3、弹窗输入prompt("请输入您的名字:","XX");
    两部分参数:①输入框上面的提示信息
    ②输入框里面的默认信息
    两者之间用逗号分隔,只有一部分时,默认为提示信息;
    默认接收到的数据为字符串

    可以定义变量接收输入内容,例如var name=prompt("请输入您的名字:","XX");
    点击确认按钮,输入更改点击取消按钮,name=null

    JS运算符

    [算术运算]
    【 + 加】【- 减】【* 乘】【 / 除】【 % 取余】【++ 自增】【-- 自减】
    +:有两种作用,链接字符串/加法运算;
    ① 当+两边均为数字时进行加法运算;
    ② 当+两边任意一边为字符串时进行字符串的链接,链接后的记过认为是字符串。
    ++:自增运算符,将变量在原有基础上+1;
    --:自减运算符,将变量在原有基础上-1;
    【N++与++N的异同】
    N++:先使用N的值进行计算,然后再把N+1;
    ++N:先把N的值+1,再用N+1以后的值,运算;
    相同点:不论N++还是++N,再执行完代码以后,均会把N+1。


    [赋值运算]
    【 = 赋值】【 += 】【 -= 】 【 *= 】 【 /= 】 【 %= 】
    +=:a+=5;相当于a=a+5;前者的执行效率要比后者快。

    [关系运算]
    【== 等于】 【 != 不等于】【=== 严格等于】【>】【<】【>=】、【<=】
    ===:严格等于;类型不同返回false;类型相同,再进行下一步判断。
    ==:等于;类型相同,再进行下一步判断;类型不同,均用Number转化为数字再判断;
    null==Undefined[对] null===Undefined[错]

    [条件运算符(多目运算)]
    a>b?true:false
    有两个关键字符号 【 ?和:】
    当?前面的部分运算结果为true时,执行前面的代码
    当?前面的部分运算结果为false时,执行后面的代码
    可以多次嵌套;例如:var jieguo=num>5?"输入太大":(num==5?"蒙对了!":"太小了");

    [逻辑运算符]
    【&& 与】【|| 或】【! 非】


    [运算符的优先级]
    ()
    ! ++ --
    % / *
    + —
    > < >= <=
    == !=
    &&
    ||
    各种赋值= += *= /= %=

    JS条件语句

    [if-else结构]
    1、写法:
    if(判断条件){
    //条件为true时执行
    }else{
    //条件为flase时成立
    }
    2、if()中的表达式,运算之后的结果应该为:[重点]
    ①Boomlean:true真 flase假
    ②string:非空字符串为真;空字符串为假。
    ③Number:0为假;一切非0均为真。
    ④Null/NaN/Undefined:全为假
    ⑤Object:全为真
    3、 else{}结构,可以根据具体情况省略;

    [多重if/阶梯if]
    1、写法:
    if(条件一){
    //条件一成立
    }else if(条件二){
    //条件一不成立,条件二成立
    }else if(条件三){
    //条件一不成立,条件不二成立,条件三成立
    }else if(条件N){
    //......
    }

    2、多重if结构中,各个判断条件是互斥的!只能选择一条。

    3、if/else最好不要省略{}
    如果省略{}则if/else结构包含的代码,仅为其后最近的一行(分号结束);
    如果省略{}则else结构永远输入其前方最近的一个if结构。

    [嵌套if]
    1、写法
    if(条件一){
    //条件一成立
    if(条件二){
    //条件一成立&&条件二成立
    }else{
    //条件一成立&&条件二不成立
    }
    }else {
    //条件一不成立
    }

    2、if结构可以多重嵌套,但原则上不超过3层

    [switch-Case结构]
    1、结构写法:
    switch(表达式){
    case常量表达式1;
    语句1;
    break;
    case常量表达式2;
    语句2;
    break;
    ....
    default;
    语句N;
    break;
    }
    2、注意事项:
    ① switch()的表达式,以及每个case后面的表达式,可以为任何JS支持的数据类型(对象和数组不行);
    ② case后面的常量表达式,必须各不相同,否则只会执行第一个;
    ③ case后的常量可以是任何数据;同一个switch结构的不同case,可以是多种不同的数据类型;
    ④ switch在进行判断的时候,采用的是全等判断===
    ⑤ break的作用,执行完case代码后,跳出当前switch结构;
    缺少break的后果,从正确的case项开始,依次执行所有的case和default
    ⑥ switch结构在判断时只会判断一次正确答案,当遇到正确的case项后,将不再判断后续项目。依次执行下去
    ⑦ switch结构的执行速率要快于多重if结构。在多分枝时可优先考虑使用switch结构。

    JS循环结构

    循坏控制语句
    1.break:终止本层循坏,继续执行本次循坏后面的语句;
    当循坏有多层时,break只会跳过一层循坏

    2.continue:跳过本次循坏,继续执行下次循坏
    对于for循环,continue执行后,继续执行循环变量更新语句n++;
    对于while,do-while,continue执行后,继续执行循环条件判断,
    所以使用俩个循环是,必须注意,continue一定要在n++之后使用。




    [嵌套循环特点]
    外层循环控制行数,内层循环控制每行元素个数;

    [做图形题思路]
    1、确定图形一共几行,即为外层循环的次数
    2、确定每行有几种元素,代表有几个内层循环的个数;
    3、确定每种元素的个数,即为每个内层循环的次数;
    Tips:通常,找出每个元素个数,与行号的关系式,即为当前内层循环的最大值;(从1开始循环)

    [循环结构的步骤]
    ①声明循环变量
    ②判断循环条件
    ③执行循环体(while的{}中所有代码的操作)
    ④更新循环变量
    然后循环执行2、3、4

    [js中循环结构支持的数据类型]
    ① Boolean: true真 flase 假
    ② String:非空字符串为真 空字符串为假
    ③ Null/NaN/Undefined:全为假
    ④ Object:全为真
    ⑤ Number:0为假,一切非0均为真;

    while循环

    while循环特点:先判断,再执行;

    [while写法:]
    var n=1;// ① 声明循环变量
    while (n<=5){// ② 判断循环条件
    document.write("while你好啊<br/>");// ③ 执行循环体(while的{}中所有代码)操作
    n++;// ④ 更新循环变量
    }

    do-while循环
    do-while循环特点:先执行,再判断;即使初始条件不成立,do-while循环也至少执行一次;

    [do-while写法:]
    var m=1;
    do{
    document.write("do-while你好啊<br/>");
    m++;
    }while(m<=5);



    [for循环]
    1、for循环有三个表达式,分别为 :①定义循环变量; ② 判断循环条件; ③ 更新循环变量
    三个表达式之间,用;分隔
    for循环三个表达式均可以省略,但是两个;不可省略
    2、for循环特点:先判断,再执行
    3、for循环三个表达式,均可以有多部分组成,之间用逗号分隔;但是第二部分判断条件需要用&&链接,最终结果需要为真/假


    for(var x=1;x<=5;x++){
    document.write("for你好啊?<br/>")
    }

  • 相关阅读:
    Python全栈day10(基础知识练习题)
    Python全栈day10(基本数据类型及其常用方法)
    Python全栈day10(运算符)
    CentOS 添加常用 yum 源(转)
    CentOS yum源设定使用方法的整理(转)
    centos6.6安装php5.3.3(2015/3/4)
    centos6.6升级安装MySQL5.5(2015/3/4)
    vi/vim显示中文字符并且去掉^M的方法
    ecmall2.3.0 前后台样式等无效,导致前台页面显示不正常问题解决
    ecmall页面空白解决方案(转)
  • 原文地址:https://www.cnblogs.com/Lv2017/p/6687081.html
Copyright © 2020-2023  润新知