• JavaScript学习(一):基本概念


    前言:<script>元素

    该元素有一下属性需要了解:

      async:表示立即下载脚本,但不应该当妨碍页面其它操作。(异步脚本)

      defer:表示脚本可以延迟到文档完全被解析和显示之后再执行。(延迟脚本)

      src:表示包含要执行代码的外部文件。

      type:编写代码的脚本语言的内容类型(MIME)。

    注:1.HTML5规定多个延迟脚本会按照出现的顺序执行,然而实现起来不确定,因此最好只包含一个延迟脚本。

      2.异步脚本的目的在于不让页面等待脚本下载执行,从而异步加载页面其他内容,因此,异步脚本不应该在加载期间修改DOM。

      3.尽可能使用外部文件包含JavaScript代码,优点:可维护、可缓存、适应未来。

    语法

    1.区分大小写

    2.标识符

      第一个字符是字母、下划线或者美元符号,惯例标识符采用驼峰格式。

    3.注释

      单行//         多行/*   */

    4.严格模式

    在顶部添加如下代码:

    ”use strict“

    5.语句

      分号不是必须,但是建议不省略。控制语句中使用代码块让编程意图明确。

    关键字和保留字

      略

    变量

      ECMAScript的变量是松散类型。

      未经声明的变量在严格模式下会抛出ReferenceError错误。

      一条语句定义多个变量,每个变量用逗号分隔开即可。

    数据类型  

      typeof 操作符可得到数据类型。

      Undefined

        声明却未初始化的值就是undefined。

    注:typeof操作符对未声明和未初始化的变量都会返回undefined,所以即便未初始化会自动赋予undefined,显式的初始化变量依然是明智的。这样typeof返回undefined时我们知道是变量未声明,而不是未初始化。

      Null

        表示一个空指针对象。

      Boolean

        true  false

        注:Boolean类型的字面量是区分大小写的,也就是说True和False都不是布尔值,只是标识符。

      Number

        1.浮点数值

        注:关于浮点数值的计算会产生舍入误差。如 0.1+0.2 = 0.300000000000000004

        2.数值范围(正无穷:Infinity  负无穷:-Infinity)   

        3.NaN(非数值)

        注:isNaN()函数帮助我们判断一个参数是否不是数值。

        4.数值转换

        Number(a)

        parseInt(a)

        parseFloat(a)

      String

        a.toString()方法返回相应值的字符串表现。

      Object

        var o = new Object();创建一个自定义对象,每个对象实例都具有下列属性和方法:

        constructor:保存着用于创建当前对象的函数。

        hasOwnProperty(propertyName):用于检查给定的属性是否在当前实例中(而不是实例的原型中)。

        isPrototypeOf(object):用于检查传入的对象是否是当前对象的原型。

        propertyIsEnumerable(propertyName):用于检查当前属性能否使用for-in语句来枚举。

        toLocalString()

        toString()

        valueOf()

        注:所有的对象都具有这些属性和方法。

    操作符

      一元操作符

      1.递增递减操作符

      ++   --  +   - 

      注:1.例:num3 = num1-- + num2;

        2.这四个操作符不仅适用于整数,对任何值都适用。转换规则略。

      2.位操作符

      按位非NOT(~)   按位与AND(&)   按位或OR(|)   按位异或XOR(^)

      左移(<<)       右移(>>)       无符号右移(>>>)

      注:左移、右移操作都是转换为二进制再进行,其中无符号右移在处理负数的时候会当作正数处理。

      3.布尔操作符

      !   &&   ||

      注:利用逻辑或的性质避免为变量赋null或undefined值。例:var a = b || c;

      4.乘性操作符

      *  /  %

      5.加性操作符

      +   -

      6.关系操作符

      <  >   <=  >=

      注:例:var result = "Brick".toLowerCase() < "alphabet".toLowerCase();  //false

          var result = "23" < "3";   //true

      7.相等操作符

      ==   !=   ===   !==

      8.条件操作符

      var max = (num1 > num2)? num1 : num2;

      9.赋值操作符

      =   *=  /=  %=  +=  -=  <<=   >>=  >>>=

      10.逗号操作符

    语句

      1.if

    2.do-while  

    do{
    }while(expression);

      3.while

      4.for

    注:因为不存在块级作用域,所以在循环内部定义的变量在外部也可以访问到。

    var count = 10;
    for(var i = 0; i < count;i==){
        alert(i);      
    }
    alert(i);       //10

      5.for-in

      for (property in expression)  statement

      6.lable

      使用lable语句在代码中添加标签,以便将来使用。

      lable: statement

      7.break       continue

    注:break语句和continue语句都可以和lable语句联合使用。

    var num = 0 ;
    
    outermost:
    for(var i=0 ; i<10; i++){
      for(var j=0; j< 10;j++) {
         if(i == 5 && j== 5){
            break outermost;    
         } 
         num++;
      }  
    }
    
    alert(num);        //55
    var num = 0 ;
    
    outermost:
    for(var i=0 ; i<10; i++){
      for(var j=0; j< 10;j++) {
         if(i == 5 && j== 5){
            continue outermost;    
         } 
         num++;
      }  
    }
    
    alert(num);        //95

      8.with

    定义with语句主要是为了简化多次编写同一个对象的工作。

    with(location){
        var qs = search.substring(1);
        var url = href;
    }
    
    //以上语句相当于:
    
        var qs = location.search.substring(1);
        var url = location.href;

    9.switch

    switch(i){
        case 25:
            alert('25');
            break;
        case 35:
            //合并两种情形
        case 45:
            alert('35and45');
            break;
        default:
            alert('Other')
    }

    除了数字,其他形式的switch用法,

    switch('hello world'){
        case 'hello' + 'world':
        ...
    }
    
    var num = 25;
    switch(true){
        case num1 > 0:
        ...
    }

    注:switch语句在比较的时候是使用的全等比较符,因此不会发生类型转换。

    函数

    声明一个函数的方式利用function关键字

    var num = 10;
    function
    add(num){ alert('answer:'+num + 1); return; alert('hello'); //不会输出 }

    执行return之后函数直接返回,不继续执行。

      1.理解参数

      ECMAScript不介意传递进来的参数数量和数据类型,在内部始终用一个数组arguments[]接受,所以实际上可以通过arguments访问参数组。

    通过下标可以在函数内部取得每一个参数,通过arguments.length获取参数总数。

    var num1 = 1,num2 = 2;
    function
    add(num1,num2){ arguments[1] = 10; alert(arguments[0] + num2); //11 }

    alert(num2); //10

    注:1.arguments对象中的值会反应到对应的命名参数中,也就是他们的值会同步,但是他们的内存空间是独立的。

      2.arguments的长度是由传入参数的个数决定的,不是由定义函数时命名参数决定的,也就是说如果只传入一个参数,arguments[1]设置值无法反映到命名参数(但是可以在内部替代执行)。

        3.没有传递值的命名参数将自动赋予undefined。

      2.没有重载

      ECMAScript中参数是包含值的数组表示的,所以无法实现函数签名,第二个函数定义会覆盖掉之前的定义,因此无法实现真正的重载。

      利用参数的类型和数量检查,让函数做出不同的反应,可以模仿方法的重载。

    比如数量检查:  

    function add(){
        if (arguments.length == 1) {
            alert(arguments[0] + 10);
        }else if (arguments.length == 2) {
            alert(arguments[0] + arguments[1]);
        }
    }
  • 相关阅读:
    0.1+0.2!==0.3
    标准盒模型IE盒模型
    Vue自定义组件通过v-model通信
    vue-cli3.0 使用 postcss-pxtorem px转rem
    render函数、createElement函数
    mixins(混入)
    vue.extend与vue.component
    js事件系列
    vue脚手架项目结构
    python模块和包
  • 原文地址:https://www.cnblogs.com/FunkyEric/p/8990331.html
Copyright © 2020-2023  润新知