zoukankan      html  css  js  c++  java
  • 2020-11-16日报博客-周一

    1.学到的东西:

    今日内容

    1. JavaScript基础
    

    JavaScript:

    * 概念:	一门客户端脚本语言
    	* 运行在客户端浏览器中的。每一个浏览器都有JavaScript的解析引擎
    	* 脚本语言:不需要编译,直接就可以被浏览器解析执行了
    
    * 功能:
    	* 可以来增强用户和html页面的交互过程,可以来控制html元素,让页面有一些动态的效果,增强用户的体验。
    
    * JavaScript发展史:
    	1. 1992年,Nombase公司,开发出第一门客户端脚本语言,专门用于表单的校验。命名为 : C--	,后来更名为:ScriptEase
    	2. 1995年,Netscape(网景)公司,开发了一门客户端脚本语言:LiveScript。后来,请来SUN公司的专家,修改LiveScript,命名为JavaScript
    	3. 1996年,微软抄袭JavaScript开发出JScript语言
    	4. 1997年,ECMA(欧洲计算机制造商协会),制定出客户端脚本语言的标准:ECMAScript,就是统一了所有客户端脚本语言的编码方式。
    
    	* JavaScript = ECMAScript + JavaScript自己特有的东西(BOM+DOM)
    
    * ECMAScript:客户端脚本语言的标准
    	1. 基本语法:
    		1. 与html结合方式
    			1. 内部JS:
    				* 定义<script>,标签体内容就是js代码
    			2. 外部JS:
    				* 定义<script>,通过src属性引入外部的js文件
    
    			* 注意:
    				1. <script>可以定义在html页面的任何地方。但是定义的位置会影响执行顺序。
    				2. <script>可以定义多个。
    		2. 注释
    			1. 单行注释://注释内容
    			2. 多行注释:/*注释内容*/
    		3. 数据类型:
    			1. 原始数据类型(基本数据类型):
    				1. number:数字。 整数/小数/NaN(not a number 一个不是数字的数字类型)
    				2. string:字符串。 字符串  "abc" "a" 'abc'
    				3. boolean: true和false
    				4. null:一个对象为空的占位符
    				5. undefined:未定义。如果一个变量没有给初始化值,则会被默认赋值为undefined
    				
    			2. 引用数据类型:对象
    			
    		4. 变量
    			* 变量:一小块存储数据的内存空间
    			* Java语言是强类型语言,而JavaScript是弱类型语言。
    				* 强类型:在开辟变量存储空间时,定义了空间将来存储的数据的数据类型。只能存储固定类型的数据
    				* 弱类型:在开辟变量存储空间时,不定义空间将来的存储数据类型,可以存放任意类型的数据。
    			* 语法:
    				* var 变量名 = 初始化值;
    			
    			* typeof运算符:获取变量的类型。
    				* 注:null运算后得到的是object
    		5. 运算符
    			1. 一元运算符:只有一个运算数的运算符
    				++,-- , +(正号)  
    				* ++ --: 自增(自减)
    					* ++(--) 在前,先自增(自减),再运算
    					* ++(--) 在后,先运算,再自增(自减)
    				* +(-):正负号
    			    * 注意:在JS中,如果运算数不是运算符所要求的类型,那么js引擎会自动的将运算数进行类型转换
                        * 其他类型转number:
                            * string转number:按照字面值转换。如果字面值不是数字,则转为NaN(不是数字的数字)
                            * boolean转number:true转为1,false转为0
    			2. 算数运算符
    				+ - * / % ...
    
    			3. 赋值运算符
    				= += -+....
    
    			4. 比较运算符
    				> < >= <= == ===(全等于)
    				* 比较方式
                      1. 类型相同:直接比较
                          * 字符串:按照字典顺序比较。按位逐一比较,直到得出大小为止。
                      2. 类型不同:先进行类型转换,再比较
                          * ===:全等于。在比较之前,先判断类型,如果类型不一样,则直接返回false
    
    
    			5. 逻辑运算符
    				&& || !
    				* 其他类型转boolean:
                       1. number:0或NaN为假,其他为真
                       2. string:除了空字符串(""),其他都是true
                       3. null&undefined:都是false
                       4. 对象:所有对象都为true
    			
    			6. 三元运算符
    				? : 表达式
    				var a = 3;
    		        var b = 4;
    		
    		        var c = a > b ? 1:0;
    				* 语法:
    					* 表达式? 值1:值2;
    					* 判断表达式的值,如果是true则取值1,如果是false则取值2;
    
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title >Title</title>
        <!--
           内部JS
           外部JS
       -->
        <script>
            alert("Hello World");
        </script>
    
        <script src="js/a.js"></script>
    
    </head>
    <body>
    <input type="text">
    
    
    </body>
    </html>
    
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    
        <script>
            //单行注释
    
            /*
                多行注释1
                多行注释2
             */
    
        </script>
    </head>
    <body>
    
    </body>
    </html>
    
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>变量</title>
    
        <script >
    
            //定义变量
           /* var a  = 3;
            alert(a);
    
            a = "abc";
            alert(a);*/
    
           //定义number类型
    
            var num = 1;
            var num2 = 1.2;
            var num3 = NaN;
    
            //输出到页面上
            document.write(num+"<br>");
            document.write(num2+"<br>");
            document.write(num3+"<br>");
            //定义string类型
    
            var str = "abc";
            var str2 = 'edf';
            document.write(str+"<br>");
            document.write(str2+"<br>");
    
            //定义boolean
            var flag = true;
            document.write(flag+"<br>");
    
            // 定义null,undefined
            var obj = null;
            var obj2 = undefined;
            var obj3 ;
            document.write(obj+"<br>");
            document.write(obj2+"<br>");
            document.write(obj3+"<br>");
    
        </script>
    
    
    </head>
    <body>
    
    </body>
    </html>
    
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>变量</title>
    
        <script >
    
            //定义变量
           /* var a  = 3;
            alert(a);
    
            a = "abc";
            alert(a);*/
    
           //定义number类型
    
            var num = 1;
            var num2 = 1.2;
            var num3 = NaN;
    
            //输出到页面上
            document.write(num+"---"+typeof(num)+"<br>");
            document.write(num2+"---"+typeof(num2)+"<br>");
            document.write(num3+"---"+typeof(num3)+"<br>");
    
            //定义string类型
    
            var str = "abc";
            var str2 = 'edf';
            document.write(str+"---"+typeof(str)+"<br>");
            document.write(str2+"---"+typeof(str2)+"<br>");
    
            //定义boolean
            var flag = true;
            document.write(flag+"---"+typeof(flag)+"<br>");
    
            // 定义null,undefined
            var obj = null;
            var obj2 = undefined;
            var obj3 ;
            document.write(obj+"---"+typeof(obj)+"<br>");
            document.write(obj2+"---"+typeof(obj2)+"<br>");
            document.write(obj3+"---"+typeof(obj3)+"<br>");
    
        </script>
    
    
    </head>
    <body>
    
    </body>
    </html>
    
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>一元运算符</title>
        <script>
            /*
            1. 一元运算符:只有一个运算数的运算符
    					++,-- , +(正号) -(负号)
    					* ++ --: 自增(自减)
    						* ++(--) 在前,先自增(自减),再运算
    						* ++(--) 在后,先运算,再自增(自减)
    
    				    * +(-):正负号
    				    * 注意:在JS中,如果运算数不是运算符所要求的类型,那么js引擎会自动的将运算数进行类型转换
                            * 其他类型转number:
                                * string转number:按照字面值转换。如果字面值不是数字,则转为NaN(不是数字的数字)
                                * boolean转number:true转为1,false转为0
             */
            var num = 3;
            var a = ++ num ;
    
            document.write(num);// 4
            document.write(a); // 3 4
            document.write("<hr>");
    
            var b = +"123abc";
            document.write(typeof (b));
            document.write(b + 1);
            document.write("<hr>");
    
            var flag = + true;
            var f2 = + false;
            document.write(typeof (flag) + "<br>");//number
            document.write(flag + "<br>");// 1
            document.write(f2 + "<br>");// 0
    
    
        </script>
    </head>
    <body>
    
    </body>
    </html>
    
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>算数运算符</title>
        <script>
            var a = 3;
            var b = 4;
    
            document.write(a+b +"<br>");
            document.write(a-b +"<br>");
            document.write(a*b +"<br>");
            document.write(a/b +"<br>");
            document.write(a%b +"<br>");
    
        </script>
    </head>
    <body>
    
    </body>
    </html>
    
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>比较运算符</title>
        <script>
            /*
             * 比较运算符:
             *     * 比较方式
             *          1. 类型相同:直接比较
             *              * 字符串:按照字典顺序比较。按位逐一比较,直到得出大小为止。
             *          2. 类型不同:先进行类型转换,再比较
             *              * ===:全等于。在比较之前,先判断类型,如果类型不一样,则直接返回false
             */
    
    
            document.write((3 > 4) +"<br>");
    
            document.write(("abc" < "acd") +"<br>");
    
    
            document.write(("123" == 123) +"<br>");
    
            document.write(("123" === 123) +"<br>");
    
        </script>
    </head>
    <body>
    
    </body>
    </html>
    
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>比较运算符</title>
        <script>
            /*
             * 逻辑运算符:
             *  &&: 与(短路)
             *  ||: 或 (短路)
             *  !:非
             *      * 其他类型转boolean:
             *          1. number:0或NaN为假,其他为真
             *          2. string:除了空字符串(""),其他都是true
             *          3. null&undefined:都是false
             *          4. 对象:所有对象都为true
             *
             *
             */
            var flag = true;
            document.write(flag+"<br>");
            document.write(!flag+"<br>");
    
            document.write("<hr>");
            //number
            var num = 3;
            var num2 = 0;
            var num3 = NaN;
            document.write(!!num+"<br>");
            document.write(!!num2+"<br>");
            document.write(!!num3+"<br>");
    
            /*while(1){
    
            }*/
    
            document.write("<hr>");
            //string
    
            var str1 = "abc";
            var str2 = "";
            document.write(!!str1+"<br>");
            document.write(!!str2+"<br>");
    
            document.write("<hr>");
    
    
            // null & undefined
            var obj = null;
            var obj2;
            document.write(!!obj+"<br>");
            document.write(!!obj2+"<br>");
    
            document.write("<hr>");
    
            // null & undefined
            var date = new Date();
            document.write(!!date+"<br>");
    
            document.write("<hr>");
    
    
    
            obj = "123";
            if(obj != null && obj.length > 0){//防止空指针异常
                alert(123);
            }
            //js中可以这样定义,简化书写。
            if(obj){//防止空指针异常
                alert(111);
            }
    
    
        </script>
    </head>
    <body>
    
    </body>
    </html>
    
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>三元运算符</title>
    
        <script>
            var a = 3;
            var b = 4;
    
            var c = a > b ? 1:0;
    
            alert(c);
    
    
        </script>
    </head>
    <body>
    
    </body>
    </html>
    

    2.遇到的问题:JavaScript技术中,变量的区分

    3.明日计划:继续学习JavaScripy技术

  • 相关阅读:
    111
    使用正则表达式,取得点击次数,函数抽离
    爬虫大作业
    Hadoop综合大作业
    hive基本操作与应用
    熟悉HBase基本操作
    爬虫大作业
    第三章 熟悉常用的HDFS操作
    数据结构化与保存
    用正则表达式,取得点击次数,函数抽离
  • 原文地址:https://www.cnblogs.com/gongyunlong-blogs/p/14139303.html
Copyright © 2011-2022 走看看