美文网首页
Javascript学习笔记

Javascript学习笔记

作者: 赫赫骑大马 | 来源:发表于2018-08-28 12:59 被阅读0次

    写了好几年代码之后发现积累跟沉淀的东西太少了,不能再犯懒了!!

    1.ECMASCRIPT&DOM&BOM -- javascript的三大组成部分

    ECMASCRIPT: ECMA(European Computer Manufacturers Association 欧洲计算机制造商协会)。
    ECMASCRIPTS是ECMA定制的标准化脚本语言,ECMA-262标准。javascript是标准化的实现。
    2015年6月17日,ECMAScript 6发布正式版本,即ECMAScript 2015

    DOM:文档对象模型(document object model) 针对 XML 但经过扩展用于HTML的应用程序编程接口。
    DOM把整个网页页面映射成为一个多层节点结构,HTML,XML页面中每个组成部分都是某类型的节点。

    BOM:浏览器对象模型(browser object model) 针对BOM可以让开发者控制浏览器显示页面以外的部分。
    BOM只处理浏览器窗口跟框架。

    2.在HTML中使用javascript

    使用<script></script>元素来引入javascript。
    <script>中的6种属性:
    async:可选。表示应该立即下载脚本,但是不应妨碍页面中的其他操作。只对外部脚本有效。

        <html>
    <head>
        <meta charset="UTF-8"/>
        <title>aaa</title>
    </head>
    <body>
    
    </body>
    
    <script type="text/javascript" src="test.js" async="async"></script>
    <script type="text/javascript" src="test2.js" async="async"></script>
        </html>
        async属性不能保证脚本加载的顺序,以上两个js脚本程序无法确定哪个会先加载,因此,需要确保脚本之间没有互相依              赖。
    
        charset:可选。表示通过src制定代码的字符集。基本没人使用。
        defer:可选。表示脚本可以延迟到整个页面加载完成之后再执行。只对外部脚本有效。
        language:已放弃。
        src:可选。表示包含要执行代码的外部文件。如果加载为外部文件,则必须。可包含跨域外部文件。
        type:可选。看成是language的替代属性。并不是必须,大多数是 text/javascript
    

    javascript默认从页面顶端开始向下加载。

    <script></script>标签内不能出现</script>

    最优加载方式:1.将所有<script>标签放置在页面的底部,紧靠</body> 的上方。可以保证页面在脚本运行之前完成解析。
    2.将脚本成组打包,页面的<script>标签越少,页面的加载速度越快,响应也更迅速。

    3.语法部分

        所有的变量,函数名,操作符,都区分大小写。
        标识符:只变量,函数,属性的名字,或者函数的参数。可以是一个或者多个字符。
        标识符规则:第一个字符必须是 字母,下划线(_),美元符($)。其他字符可以是字母,下划线,美元符,或者数字。
        按照惯例,采用驼峰大小写格式,firstSecond/myCar/doSomeThingImportant
        语句:采用分号结尾  var sum = a + b;
        关键字&保留字 略。
    

        变量:松散类型,可以用来保存任何数据。使用 var 关键字来定义变量。 var message = 1;
        var message;类似这种没有经过初始化的变量,会保存一个特殊的值--undefined。
        注意:使用 var 定义的变量,将成为定义该变量作用域中的局部变量。也就是说,如果在函数中使用var 来定义的变量,在函数执行之后,会被销毁。
        function test(){
            var message = 'hello world';
        }
        test();
        alert(message);//会报错
    
        省略 var 操作符 可以定义全局变量
        function test(){
            message = 'hello world';
        }
        test();
        alert(message);//有效   不推荐
    
         使用一条语句定义多个变量
        var message = 'hello',
              message2 = 'world',
              message3 = '哈哈哈';
    

        数据类型: 共有五种数据类型, Undefined,Null,Boolean,Number,String。还有一种复杂数据类型 Object
        Object本质上是一组无序的名值对组成。
        typeof 操作符 来检测变量类型,是操作符不是函数,所以后面的括号不是必须的。
        typeof message 等同于 typeof(message)
        返回字符串:“undefined” -- 未定义。
                          “boolean” -- 布尔值。
                          “string” --   字符串。
                          “number” -- 数值。
                          “object” -- 对象或者null。
                          “function” -- 函数。
    
        特例: alert(typeof null); 返回 object,因为null被认为是一个空的对象引用。
    
        Undefined类型:只有一个值,undefined。var 变量 但是并没有赋值,则是 undefined。
        undefined 与 未定义变量不同。
        例子:var a = 'HELLO';
                 //var b = 'nihao';
                  alert(a); // undefined
                  alert(b); //报错
          对未初始化的变量进行 typeof 会返回 undefined,对未定义的变量进行 typeof 同样会返回 undefined。
                  var a = 'HELLO';
                 //var b = 'nihao';
                  alert(typeof a); // undefined
                  alert(typeof b); //undefined
    
         Null类型:第二个只有一个值的类型,null。 null值表示一个空对象指针。因为 进行 typeof 操作会 返回 object。
         如果定义的变量准备在将来使用,最好将初始化的值设置为null。这样,只要检查 null值 就可以知道相应的变量是否已经报错了一个对象的引用,
        var car = null;
        if(car != null)
        {
              //do some thing...
        }
    
        实际上,undefined 值 是派生自 null 值的,所以,他们的相等性测试会返回 true。
        alert(undefined == null);//true
    
        Boolean类型:只有两个字面值 true false。这两个值与数字值不是一回事。两个字面值区分大小写,True False 都不是Boolean类型,只是标识符。可以通过Boolean(aaa)来转换一个值为Boolean类型。
        数据类型转换:    Boolean   true 为 true  false 为 false。
                                 String  任何非空字符串 为 true  ""空字符串 为 false。
                                 Number  任何非0数字值包括无穷大  为 true  0和NaN 为 false。
                                 Object  任何对象 为 true  null 为false。
                                 Undefined  n/a 为 true  undefined 为 false
        例:var aa = 'aaaaa';
              if(aa)
               {
                  alert(' true');
               }
        Number类型:是数字值对应的引用类型。要创建Number对象,可以调用Number构造函数时向其中传递相对应的值。
        例:var numberObject = new Number(10);
        与Boolean类型一样,Number类型也重写了valueOf() toLocaleString() toString()方法。 重写后,valueOf()返回对象表示的基本类型的数值,另外两个方法返回字符串形式的数值。还可以为 toSting()方法传递一个表示基数的参数,告诉他表示几进制数值的字符串形式。
        例:var num = 10;
        alert(num.toString()) //10
        alert(num.toString(2))//二进制 1010
        
        除了继承的方法外,Number类型还提供了一些用于将数值格式化为字符串的方法。
        例:var num = 10;  alert(num.toFixed(2))// “10.00”   表示显示几位小数,用0填补空位
        如果数值本身包含的小数位数比指定的多,接近指定的最大小数位的值会舍入
        例:var num = 10.005;alert(num.toFixed(2)) // 10.01
    
        toPrecision()返回固定大小的格式,也可能返回指数格式。
        例:var num = 99;
              alert(num.toPrecision(1))//"1e+2"
              alert(num.toPrecision(2)) //"99"
              alert(num.toPrecision(3)) // "99.0"
    
         与Boolean类型 类似,Number对象也以后台方式为数值提供重要功能。
         不建议直接实例化Number类型,原因与显示创建Boolean对象一样,具体来讲,使用 typeof 和 instanceof 操作符测试基本类型数值与引用类型数值时,得到的结果不同。
         例:var numberObject = new Number(10);
               var numberValue  = 10;
              alert(typeof numberObject) // "object"
              alert(typeof numberValue) // "number"
              alert(numberObject instanceof Number)//true
              alert(numberValue instanceof Number) //false
    
            String类型:字符串的对象包装类型,使用String构造函数来创建
            例:var stringValue = new String("hello world");
            String对象的方法,也可以在所有基本的字符串值中访问到 valueOf() toLocaleString()toSting()都返回对象表示的基本上字符串值。
            String类型的每个实例,都有一个length属性,表示字符串中包含多少个字符。
            例:var stringValue = new String("hello world");
                  alert(stringValue.length)//11  空格也算字符
             即使字符串中包含双字节字符,每个字符也仍然算一个字符。
              一·字符方法:用于访问字符串中特定字符的方法:charAt()  charCodeAt() 这两个方法都基于一个参数,即基于 0 字符的位置.
              例:var stringValue = ‘hello world’;
                    alert(stringValue.charAt(1))// "e" 
                    alert(stringValue.charCodeAt(1))// 101
                    alert(stringValue[1])// "e"   IE7 或者更早版本返回 undefined
               二·字符串操作方法: concat() 用于将一个或多个字符串拼接起来,返回拼接得到的新字符串。
               例:var string1 = "hello";
                     var res = string1.concat("world");
                     alert(res);//"helloworld"
                concat()方法拼接字符串,原字符串值不变,可以传任意多个参数进行拼接。
                大多数情况下 用 "+",简易。
                slice() substr() substring() 这三个方法都返回被操作字符串的一个子字符串,而且也都接受一个或者两个参数。第一个参数指定 子字符串的开始位置,第二个参数指定子字符串的结束位置。 其中 substr()的第二个参数指定返回的字符串个数。如果没有给这些方法传递第二个参数,则将字符串的长度作为结束位置。
                  例: var stringValue = 'hello world';
                       alert(stringValue.slice(3)); // 'lo world'
                       alert(stringValue.substr(3)); // 'lo world'
                       alert(stringValue.substring(3)); // 'lo world'
    
                       alert(stringValue.slice(3, 7)); // 'lo w'
                       alert(stringValue.substr(3, 7)); // 'lo worl' 
                       alert(stringValue.substring(3, 7)); // 'lo w' 
                  如果参数是负值:
                  例:var stringValue = 'hello world';
                        alert(stringValue.slice(-3)); // 'rld'   slice()传入负值会将负值与字符串长度相加,
                        alert(stringValue.substring(-3)); // 'hello world'  substring()会将全部负值转换为0
                        alert(stringValue.substr(-3)); // 'rld'  substr() 将负的第一个数与字符串长度相加,第二个转换为0
    
                   三·字符串位置方法:indexOf()  lastIndexOf()这两个方法都是从一个字符串中搜索给定的子字符串的位置,如果没有,返回-1。区别: indexOf从头开始找  lastIndexOf 从后开始找
                   例:var stringValue = 'hello world';
                         alert(stringValue.indexOf(‘o’))// 4
                         alert(stringValue.lastIndexOf(‘o’))//7
                    如果子字符串只出现一次,两个返回值相同。两个方法都可以传第二个参数 指定开始查找位置,
    

    相关文章

      网友评论

          本文标题:Javascript学习笔记

          本文链接:https://www.haomeiwen.com/subject/gslpjttx.html