zoukankan      html  css  js  c++  java
  • Java scirpt简介

    Java scirpt简介

    学号:201631062509

    姓名:杨菓

    1.JavaScript 简介

    JavaScript一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型。它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标准通用标记语言下的一个应用)网页上使用,用来给HTML网页增加动态功能。

     JavaScript 是脚本语言。

     JavaScript 是一种轻量级的编程语言。

     JavaScript 是可插入 HTML 页面的编程代码。

     JavaScript 插入 HTML 页面后,可由所有的现代浏览器执行。

     JavaScript 很容易学习。

    2.相关概念

    语句

    JavaScript程序是由若干语句组成的,语句是编写程序的指令。JavaScript提供了完整的基本编程语句,它们是:

    赋值语句、switch选择语句、while循环语句、for循环语句、for each循环语句、do...while循环语句、break循环中止语句、continue循环中断语句、with语句、try…catch语句、if语句(if..else,if…else if…)。

    函数

    函数是命名的语句段,这个语句段可以被当作一个整体来引用和执行。使用函数要注意以下几点:

    1)函数由关键字function定义(也可由Function构造函数构造)

    2)使用function关键字定义的函数在一个作用域内是可以在任意处调用的(包括定义函数的语句前);而用var关键字定义的必须定义后才能被调用

    3)函数名是调用函数时引用的名称,它对大小写是敏感的,调用函数时不可写错函数名

    4)参数表示传递给函数使用或操作的值,它可以是常量,也可以是变量,也可以是函数,在函数内部可以通过arguments对象(arguments对象是一个伪数组,属性callee引用被调用的函数)访问所有参数

    5)return语句用于返回表达式的值。

    6)yield语句扔出一个表达式,并且中断函数执行直到下一次调用next。

    一般的函数都是以下格式:

    function myFunction(params){

    //执行的语句

    }

    函数表达式:

    var myFunction=function(params){

    //执行的语句

    }

    var myFunction = function(){

    //执行的语句

    }

    myFunction();//调用函数

    匿名函数,它常作为参数在其他函数间传递:

    window.addEventListener('load',function(){

    //执行的语句

    },false);

     

    对象

    JavaScript的一个重要功能就是面向对象的功能,通过基于对象的程序设计,可以用更直观、模块化和可重复使用的方式进行程序开发。

    一组包含数据的属性和对属性中包含数据进行操作的方法,称为对象。比如要设定网页的背景颜色,所针对的对象就是document,所用的属性名是bgcolor,如document.bgcolor="blue",就是表示使背景的颜色为蓝色。

    注释

    JavaScript 注释[4]不会被执行,所以我们可以添加注释来对 JavaScript 进行解释,或者提高代码的可读性。

    单行注释:

    单行注释以 // 开头,比如:

    // 输出标题: 

    document.getElementById("myH1").innerHTML="欢迎来到我的主页"; 

    // 输出段落: 

    document.getElementById("myP").innerHTML="这是我的第一个段落。";

    多行注释:

    多行注释以 /* 开始,以 */ 结尾,例子:

    /* 

    下面的这些代码会输出 

    一个标题和一个段落 

    并将代表主页的开始 

    */ 

    document.getElementById("myH1").innerHTML="欢迎来到我的主页"; 

    document.getElementById("myP").innerHTML="这是我的第一个段落。";

    除此之外,我们还可以通过注释功能来阻止码块的执行(可用于调试),比如:

    //document.getElementById("myH1").innerHTML="欢迎来到我的主页";

    document.getElementById("myP").innerHTML="这是我的第一个段落。";

    事件

    用户与网页交互时产生的操作,称为事件。事件可以由用户引发,也可能是页面发生改变,甚至还有你看不见的事件(如Ajax的交互进度改变)。绝大部分事件都由用户的动作所引发,如:用户按鼠标的按键,就产生click事件,若鼠标的指针在链接上移动,就产生mouseover事件等等。在JavaScript中,事件往往与事件处理程序配套使用。

    而对事件的处理,W3C的方法是用addEventListener()函数,它有三个参数:事件,引发的函数,是否使用事件捕捉。为了安全性,建议将第三个参数始终设置为false

    传统的方法就是定义元素的on…事件,它就是W3C的方法中的事件参数前加一个“on”。而IE的事件模型使用attachEvent和dettachEvent对事件进行绑定和删除。JavaScript中事件还分捕获和冒泡两个阶段,但是传统绑定只支持冒泡事件。 

    变量

    1、常用类型

    object:对象

    array:数组

    number:数

    boolean:布尔值,只有true和false两个值,是所有类型中占用内存最少的

    nll:一个空值,唯一的值是null

    undefined:没有定义和赋值的变量

    2、命名形式

    一般形式是:

    var <变量名表>;

    其中,var是javascript的保留字,表明接下来是变量说明,变量名表是用户自定义标识符,变量之间用逗号分开。和C++等程序不同,在javascript中,变量说明不需要给出变量的数据类型。此外,变量也可以不说明而直接使用。

    3、作用域

    变量的作用域由声明变量的位置决定,决定哪些脚本命令可访问该变量。在函数外部声明的变量称为全局变量,其值能被所在HTML文件中的任何脚本命令访问和修改。在函数内部声明的变量称为局部变量。只有当函数被执行时,变量被分配临时空间,函数结束后,变量所占据的空间被释放。局部变量只能被函数内部的语句访问,只对该函数是可见的,而在函数外部是不可见的。

    运算符

    javascript提供了丰富的运算功能,包括算术运算、关系运算、逻辑运算和连接运算。

    1、算术运算符

    javascript中的算术运算符有单目运算符和双目运算符。双目运算符包括:+(加)、-(减)、*(乘)、/(除)、%(取模)、|(按位或)、&(按位与)、<<(左移)、>>(右移)等。单目运算符有:-(取反)、~(取补)、++(递加1)--(递减1)等。

    2、关系运算符

    关系运算符又称比较运算,运算符包括:<(小于)、<=(小于等于)、>(大于)、>=(大于等于)、=(等于)和!=(不等于)。

    关系运算的运算结果为布尔值,如果条件成立,则结果为true,否则为false。

    3、.逻辑运算符

    逻辑运算符有:&&(逻辑与)、||(逻辑或)、!(取反,逻辑非)、^(逻辑异或)。

    4、字符串连接运算符

    连接运算用于字符串操作,运算符为+(用于强制连接),将两个或多个字符串连结为一个字符串。

    5、三目操作符

    三目操作符“?:”格式为:

    操作数?表达式1:表达式2

    三目操作符“?:”构成的表达式,其逻辑功能为:若操作数的结果为true,则表述式的结果为表达式1,否则为表达式2。例如max=(a>b)?a:b;该语句的功能就是将a,b中的较大的数赋给max。 

    相关规则

    在JavaScript中,“==="是全同运算符,只有当值相等,数据类型也相等时才成立。

    等同运算符“=="的比较规则:

    当两个运算数的类型不同时:将他们转换成相同的类型。

    1)一个数字与一个字符串,字符串转换成数字之后,进行比较。

    2)true转换为1、false转换为0,进行比较。

    3)一个对象、数组、函数与 一个数字或字符串,对象、数组、函数转换为原始类型的值,然后进行比较。(先使用valueOf,如果不行就使用toString)

    4)其他类型的组合不相等。

    想两个运算数类型相同,或转换成相同类型后:

    1)2个字符串:同一位置上的字符相等,2个字符串就相同。

    2)2个数字:2个数字相同,就相同。如果一个是NaN,或两个都是NaN,则不相同。

    3)2个都是true,或者2个都是false,则相同。

    4)2个引用的是同一个对象、函数、数组,则他们相等,如果引用的不是同一个对象、函数、数组,则不相同,即使这2个对象、函数、数组可以转换成完全相等的原始值。

    5)2个null,或者2个都是未定义的,那么他们相等。

    而“===”是全同运算符,全同运算符遵循等同运算符的比较规则,但是它不对运算数进行类型转换,当两个运算数的类型不同时,返回false;只有当两个运算数的类型相同的时候,才遵循等同运算符的比较规则进行比较。

    例如:null==undefined 会返回真, 但是null===undefined 就会返回假!

    表达式

    表达式是指将常量、变量、函数、运算符和括号连接而成的式子。根据运算结果的不同,表达式可分为算术表达式、字符表达式、和逻辑表达式。

    脚本语言

    不同于服务器端脚本语言,例如PHP与ASP,JavaScript是客户端脚本语言,也就是说JavaScript是在用户的浏览器上运行,不需要服务器的支持而可以独立运行。所以在早期程序员比较青睐于JavaScript以减少对服务器的负担,而与此同时也带来另一个问题:安全性。而随着服务器的强壮,虽然程序员更喜欢运行于服务端的脚本以保证安全,但JavaScript仍然以其跨平台、容易上手等优势大行其道。

    JavaScript是一种脚本语言,其源代码在发往客户端运行之前不需经过编译,而是将文本格式的字符代码发送给浏览器由浏览器解释运行。解释语言的弱点是安全性较差,而且在JavaScript中,如果一条运行不了,那么下面的语言也无法运行。而且由于每次重新加载都会重新解译,加载后,有些代码会延迟至运行时才解译,甚至会多次解译,所以速度较慢。

    与其相对应的是编译语言,例如Java。Java的源代码在传递到客户端运行之前,必须经过编译,因而客户端上必须具有相应平台上的仿真器或解释器,它可以通过编译器或解释器实现独立于某个特定的平台编译代码的束缚。但是它必须在服务器端进行编译,这样就拖延了时间。但因为已经封装,所以能保证安全性。

    Javascript库

    库,指得是可以方便应用到现有开发体系中的、现成的代码资源。库不仅为大部分日常的DOM脚本编程工作提供了快捷的解决方案,而且也提供了许多独特的工具。虽然库使用起来很方便,但它们也并非能解决你所有的问题。在使用库之前,一定要保证真正理解javascript的DOM原理。

    这些库一般是一个(或多个)js(Javascript的缩写)文件,只要把他们导入你的网页就能使用了。

    常用的库有:

    jQuery:javascript库中的新成员,提供css和xpath选择符查找元素、ajax、动画效果等

    JSer: 国人开发的一款全功能的开源脚本框架. 借助JSer,可以便捷的操作DOM、CSS样式访问、属性读写、事件绑定、行为切换、动态载入、数据缓存、URL与AJAX等众多功能。

    dojo:一个巨大的库,包括的东西很多,dijit和dojox是dojo的扩展,几乎你想要的各种javascript程序都包括了。

    prototype:一个非常流行的库,使用了原型链向javascript中添加了很多不错的函数

    YUI:(YahooYUI库)yahoo!用户界面,非常实用,提供各种解决方案。

    ExtJs:组件非常丰富,皮肤也很漂亮,动画效果也丰富。

     3.特点

    JavaScript脚本语言具有以下特点:
    (1)脚本语言。JavaScript是一种解释型的脚本语言,C、C++等语言先编译后执行,而JavaScript是在程序的运行过程中逐行进行解释。
    (2)基于对象。JavaScript是一种基于对象的脚本语言,它不仅可以创建对象,也能使用现有的对象。
    (3)简单。JavaScript语言中采用的是弱类型的变量类型,对使用的数据类型未做出严格的要求,是基于Java基本语句和控制的脚本语言,其设计简单紧凑。
    (4)动态性。JavaScript是一种采用事件驱动的脚本语言,它不需要经过Web服务器就可以对用户的输入做出响应。在访问一个网页时,鼠标在网页中进行鼠标点击或上下移、窗口移动等操作JavaScript都可直接对这些事件给出相应的响应。
    (5)跨平台性。JavaScript脚本语言不依赖于操作系统,仅需要浏览器的支持。因此一个JavaScript脚本在编写后可以带到任意机器上使用,前提上机器上的浏览器支 持JavaScript脚本语言,目前JavaScript已被大多数的浏览器所支持。
    不同于服务器端脚本语言,例如PHP与ASP,JavaScript主要被作为客户端脚本语言在用户的浏览器上运行,不需要服务器的支持。所以在早期程序员比较青睐于JavaScript以减少对服务器的负担,而与此同时也带来另一个问题:安全性。
    而随着服务器的强壮,虽然程序员更喜欢运行于服务端的脚本以保证安全,但JavaScript仍然以其跨平台、容易上手等优势大行其道。同时,有些特殊功能(如AJAX)必须依赖Javascript在客户端进行支持。随着引擎如V8和框架如Node.js的发展,及其事件驱动及异步IO等特性,JavaScript逐渐被用来编写服务器端程序。
    4.DOM

    D:document, 当创建了一个网页并把它加载到WEB浏览器中时,DOM就在幕后把编写的网页文档转换成一个文档对象

    O:object,用户自定义对象、内建对象、宿主对象。

    M:model,模型,事物的表现形式。DOM代表着加载到浏览器窗口的当前网页。浏览器提供了网页的模型,我们通过JS去读取。DOM把一份文档表示为一棵树。

    节点:

    元素节点:标签的名字就是元素的名字。

    文本节点:元素包含的文本。在XHTML文档里,文本节点总是被包含在元素节点的内部。

    属性节点:用来对元素做出更具体的描述。

    获取DOM元素:

      getElementById(id): document对象特有的方法。id应该放在单引号或双引号里。只有一个参数,返回一个对象,对象对应document对象里唯一的对象。

      getElementByTagName(): 只有一个参数,返回一个对象数组。即使在整个文档里这个标签值有一个元素,也返回一个长度为1的数组。允许通配符作为参数(“*”)。

      getElementByClassName: 只接受一个参数,返回一个具有相同类名的元素的数组。(“classname1 classname2”),只一个参数,但允许指定多个类名,在一个参数里用空格隔开。

    获取和设置元素属性:

      getAttribute(): Object.getAttribute(attribute); 通过元素节点调用;目标对象没有目标属性,返回null;

      setAttribute():Object.setAttribute(attribute, value);

    HTML DOM 模型被构造为对象的树。

    HTML DOM 树

    DOM HTML 树

    通过可编程的对象模型,JavaScript 获得了足够的能力来创建动态的 HTML。

    • JavaScript 能够改变页面中的所有 HTML 元素
    • JavaScript 能够改变页面中的所有 HTML 属性
    • JavaScript 能够改变页面中的所有 CSS 样式
    • JavaScript 能够对页面中的所有事件做出反应

    5.Java Script 和 Java的区别

    JavaScript 与 Java 没有任何关系,JavaScript 不是 Java 的脚本语言,也不是以 Java 为基础!

    JavaScript 和 Java 是两个公司开发的不同的编程语言:

    • Java 是 SUN 公司的产品,是面向对象的程序设计语言,适用于软件开发、Web开发、Android开发和嵌入式开发。
    • JavaScript 是 Netscape 公司的产品,最初是为了扩展 Netscape 浏览器的功能。

    注:JavaScript 最初被命名为“ LiveScript ”,随着 Java 的流行,为了营销,改名为“ Javascript ”,完全是一种商业手段,与语言本身的结合性没有关系。

  • 相关阅读:
    python中的编码问题
    CVPR2018 Tutorial 之 Visual Recognition and Beyond
    hdu 1376 Octal Fractions
    hdu 1329 Hanoi Tower Troubles Again!
    hdu 1309 Loansome Car Buyer
    hdu 1333 Smith Numbers
    hdu 1288 Hat's Tea
    hdu 1284 钱币兑换问题
    hdu 1275 两车追及或相遇问题
    hdu 1270 小希的数表
  • 原文地址:https://www.cnblogs.com/Yy-Gg/p/10577554.html
Copyright © 2011-2022 走看看