js----第一篇

计算机组成:

软件:应用软件:浏览器(Chrime/IE/Firefox))、qq

          系统软件:Windows、linux、macOSX

硬件

 三大件:cpu、内存、硬板--主板

输入设备:鼠标、键盘、打印机、投影仪等

1 学习js目标:
   程序90% 来自生活

    - 掌握编程的基本思维
    - 掌握编程的基本语法
HTML和CSS 小米
2 课前说明
    目标:掌握编程的基本思想
    掌握JavaScript的基础语法,使用常见API(备注) 完成相应案例及练习和作业
    培养独立解决问题能力
    遇到问题先独立调试(牛X   从规范和调试开始)
    能够独立写出所有案例代码
3 注意:

    2. 注重基础,以最简单的案例说明问题,并以企业项目案例进行实践
    3. 课上思考,课下提问。不需要深究的地方不要钻牛角尖。
    4. 必须完成作业,基础坚挺的同学低调,基础薄弱同学多敲多问 博客
            几句话送给大家:**死磕到底!**
            笔记和代码是”大家的”,
       自己写的才是自己的.
       复制代码者,没有”男朋友”
      不写代码者,没有”女朋友”
4 ##课外提示
    1.金山打字敲代码用指法,一般坚持一周者即可熟练
    2.码农不需要练就一阳指或者二指禅
    3.可以使用金山打字通,此处并非打广告,个人建议,天天敲代码,
      不停的反复的敲练习和作业,速度和基本功的快速提升   20遍  12k起   8k
      
    奉劝各位:

5 解决一个问题
## 网页、网站和应用程序
网页:单独的一个页面
网站:一些列相关的页面组成到一起
应用程序:可以和用户产生交互,并实现某种功能。
=======================================================================================
1、Javascript前世今生      *
    1.1、什么是Javascript
    Javascript运行于Javascript 【解释器/引擎】中的解释性脚本语言(浏览器中)
    Javascript运行环境:
        1、Javascript解释器 :NodeJS(软件)
        2、嵌入在浏览器中的内核(引擎)

1.2、Javascript 发展   **
    1、1992年 Nombas公司 开发了一款脚本语言 ScriptEase ,可以嵌入在网页中
        大概在 1992 年,一家称作 Nombas 的公司开发了一种叫做 C 减减(C-minus-minus,简称 Cmm)的嵌入式脚本语言。Cmm 背后的理念很简单:一个足够强大可以替代宏操作(macro)的脚本语言,同时保持与 C (和 C ++)足够的相似性,以便开发人员能很快学会。这个脚本语言捆绑在一个叫做 CEnvi 的共享软件中,它首次向开发人员展示了这种语言的威力。
        Nombas 最终把 Cmm 的名字改成了 ScriptEase,原因是后面的部分(mm)听起来过于消极,同时字母 C “令人害怕”。
        现在 ScriptEase 已经成为了 Nombas 产品背后的主要驱动力。
    2、1995年 Netscape[neitskeip]公司(美国Netscape公司,以开发Internet浏览器闻名) 为 [ˈnævɪgeɪtə(r)]Navigator2.0浏览器开发了一款脚本语        言 LiveScript ,
        为了赶时髦 将其命名为 Javascript。Javascript与Java没有一点关系
    3、1996年,Microsoft[maikrisouft] ,为了IE3.0,发布了一个Javascript克隆版本 JScript
    4、1997年 Javascript1.1 作为草案提交给了 ECMA(欧洲计算机制造商协会)
    --> ECMA-262标准 -->ECMAScript
 


1.3 Javascript (JS)的组成:                             *****

    1、核心(ECMAScript, ES)语法
    2、文档对象模型(DOM,Document Object Model) 一套操作页面元素的API
        DOM可以把HTML看做是文档树,通过DOM提供的API可以对树上的节点进行操作
    3、浏览器对象模型(BOM,Borowser Object Model) 弹出框、控制浏览器跳转、获取分辨率等 一套操作浏览器功能的API.

1.4 Javascript特点   **
    1、任何编辑工具都可以编写Javascript,语法类似于Java,C,...
    2、无需编译
    3、弱类型语言
       由值来决定数据类型


1.5 基于对象的编程语言   **
   java面向对象的语言

   面向过程:亲力亲为
   面向对向:委派多人干多事

    万物皆对象  


1.6 Javascript的用途   ****
    用来给HTML网页增加动态功能。
    最初的目的是为了处理表单的验证操作。

    ### JavaScript现在的意义(应用场景)

    JavaScript 发展到现在几乎无所不能。

    1. 网页特效 客户端数据计算 表单验证 非空验证 数据范围验证 浏览器事件的触发和处理
    2. 服务端开发(Node.js) 服务器的异步数据提交(ajax)
    3. 命令行工具(Node.js)
    4. 桌面程序(Electron)
    5. App(Cordova)
    6. 控制硬件-物联网(Ruff)
    7. 游戏开发(cocos2d-js)
JavaScript和HTML、CSS的区别    *****

    1. HTML:提供网页的结构,提供网页中的内容
    2. CSS: 用来美化网页
    3. JavaScript: 可以用来控制网页内容,给网页增加动态的效果
2、使用javaScript   *****
    2.1 浏览器说明  *
        浏览器是指可以显示网页服务器或者文件系统的HTML文件内容,并让用户与这些文件交互的一种软件。
        通俗的讲:可以显示页面的一个软件,
        国内网民计算机上常见的网页浏览器有,QQ浏览器、Internet Explorer、Firefox、Safari,Opera、Google Chrome、百度浏览器、搜狗浏览器、猎豹浏览器、360浏览器、UC浏览器、傲游浏览器、世界之窗浏览器等,浏览器是最经常使用到的客户端程序。
        常用的五大浏览器:chrome,firefox,Safari,ie,opera
        我们用chrome(谷歌浏览器)
    2.2、JavaScript初体验(JavaScript的书写位置)
    CSS:行内样式、嵌入样式、外部样式
        A:写在行内
        <input type="button" value="按钮" onclick="alert('Hello World')" />
        B:写在script标签中
        <head>
        <script>
        alert('Hello World!');
        </script>
        </head>
        C: 写在外部js文件中,在页面引入
        <script src="main.js"></script>
        注意点
        引用外部js文件的script标签中不可以写JavaScript代码
    2.3语句
        被Javascript引擎所解释执行的一句代码
        组成:
        表达式、关键字
        
        表达式:由一个或多个运算符以及一个或多个操作数组成的。 如:1+2,
        特点:以分号表示结束
        console.log();
        document.write();
        alert();
        习惯:一行只写一条语句
        注意:严格区分大小写   XML 严格区别大小写
        console.log();
        console.Log();错误
    2.4、注释
    单行注释://
    多行注释:/*        */

3、变量****
    内存 : 临时性保存据算计程序在【运行过程中】要用到的数据。
    TB->GB->MB->KB->B->bit
    
    Javascript
    硬盘 : 永久性保存数据
    0x000000000000000000a13247aaccxx
    3.1、什么是变量
        就是内存中的一段空间,用于保存程序运行过程中要用到的数据。就是存储数据的容器。
    3.2、为什么要使用变量
        使用变量可以方便的获取或者修改内存中的数据
    3.3、什么是变量名
        内存空间的一个别名,为了方便记忆。即变量的名字。
    3.4、如何使用变量 到内存中开辟一段空间用于保存数据
        语法:var 声明变量
        var age;
        变量的赋值
        将数据保存进变量
        运算符:= 赋值运算符
        语法:
        变量名=值;
        var name;
        name="张无忌";
        var name = "张无忌";

        初始化:声明变量并赋值
        var 变量名称=值;

        注意:没有被赋值的变量自动取值为undefined
        var  name ;

    var name;
    var age;
    var hobby;
    一条语句中声明多个变量:
    var name,age,hobby;
    var name="张三丰",age=30;
    3.5、变量名命名规范     *****
        1、要求
            1、不允许使用关键字以及保留关键字命名
            标准关键字:
            eg : var , function , if , for ,true,false ...
            保留关键字:
            class,int,float,double ... ...
        2、命名规范
                a、可以包含字母、数字、下划线 _、$
            b、不能以数字开头
                var name;
                var name1;
                var 1name;错误
            c、不允许重复
            d、尽量见名知意
            var name;
            var age;

            var a,b,c,d,....aa,ab,ac,ad;  不建议
            var xingming,nianling;
        e、推荐采用
            驼峰命名法
            如果变量名称由多个单词组成,第一个单词全部小写,第二个单词开始,首字符变大小
            userName
            txtusernmae --> txtUserName
            下面哪些变量名不合法
                a    
                1
                age18
                18age
                name
                $name
                _sex
                &sex
                theworld theWorld
    3.6、变量使用注意问题
        1、未初始化变量的使用
        var age;
        只定义未赋值,值为undefined
        未定义,使用,错误,not defined
        2、在可能的情况下,声明变量时尽量初始化
        var age=10;
        var name="张三";
        var isHappy=true;
        3、将变量的声明和赋值分开操作
        var name;
        var age;
        name="";
        age=18;
4、对变量进行的存取操作
    1、设置变量的值(赋值,存)
    
    var name="张三丰";//张三丰
    name="张无忌";//张无忌
        
    2、获取变量的值(取值)
    var uname="张无忌";
    console.log(uname);

    var newName = uname;
    uname : 取值操作(=右边使用)
    newName : 赋值操作(=左边使用)
5、运算符     *****
    1、算数运算符
        +,-,*,/,%   算术运算符
        %:取余(模),计算两个数字相除后的  余数
        5%2 结果为 1
        3%5 结果为 3

    常用场合:
    1、获取数字的最后一位
        1234
        1234%10=123 ... 4
        1234%100 = 12 ... 34

    2、判断奇偶性 或 判断 是某数字的倍数
    58 % 2 结果是否为 0?



    + :
        1、求和:数字类型的数值求和  
        2、"" 与 +联用 ,作用是拼接        "1"+1=11  "a"+1=a1
            "张无忌" + 123 结果为:张无忌123
            123 + "张无忌" 结果为:123张无忌

            12+25 结果为:37

            "12"+25 结果为:1225
            '12'+25 结果为:1225

6、数据类型  基本数据类型  引用数据类型   *****
    1、什么是数据类型
        保存在内存中的数据的类型,根据不同的类型内存中所开辟的空间也不一样        
    2、数据类型
    1、原始类型 (基本类型)
        1、number 类型
            数字
            可以表示 32 位 (4字节)的整数,或64位(8字节)的浮点数
            浮点数:小数

            var age;
            age=12; //number
            age=24.5;//number        

        2、string 类型
            字符串
            一系列的文本数据
            注意:赋值时,必须使用 " " 或 ' ' 扩起
            var name="张三丰";//string
            var age = "12"; //string

            特殊字符,可以通过转移字符实现
            "Hello World"
            console.log(""Hello World"");错误


             console.log("Hello World");
        3、boolean 类型
            布尔
            只表示 肯定(真) 或 否定(假)的数据
            值:true(真) 和 false(假)
            使用场合:作为程序的条件(判断、循环)
            在与 number 类型做运算时,true=1,false=0
        4、null 类型
            空
        5、undefined 类型
            未定义
            表示 不存在的数据
2、引用类型
    Object 对象
    Arraay
    ArrayList
    Person

   ...

猜你喜欢

转载自www.cnblogs.com/fbbg/p/10446692.html
今日推荐