热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

Java学习前端4

今日学习内容总结如下:定时器使用setTimeout和setInterval。setTimeout只执行一次,setInterval会按照指定时间间

今日学习内容总结如下:


定时器使用

setTimeout和setInterval。setTimeout只执行一次,setInterval会按照指定时间间隔反复执行


  • setTimeout("调用的函数", "定时的时间") ,例如 var myTime=setTimeout("disptime( ) ",1000); 每隔1000毫秒调用函数disptime( )执行
  • clearTimeout(myTime);关闭定时器

动画效果



窗口定时关闭




复合类型

复合类型就是由多个基本数据类型,包括复合类型,组成的数据体。 复合类型包括对象Object、数组Array和函数Function三种


对象

对象是一系列命名变量、函数的集合。对象中的命令变量称为属性,对象中的函数称为方法。对象访问 成员的语法是点运算符【对象变量名.成员名称】实现

访问浏览器的版本号 navigator.appVersion ,这里的navigator就是BOM浏览器对象,编程显示使用 的document就是DOM文档对象

Javascript 是基于对象的脚本语言,它提供了大量的内置对象。常见的内置类由数组类Array、日期类 Date、错误类Error、函数类Function、数学类Math、数值Number、对象类Object和字串类String


数组

数组实际上就是一系列变量,其中数组元素的类型可以不相同,可以通过使用length属性获取当前数组 中的元素个数,也可以修改length属性对数组进行裁剪

var arr1=[1,2,34,5]; //定义数组并同时进行数组元素赋值,下标从0开始,例如arr1[0]就是1 var arr2=new Array();//定义一个空数组 arr2=new Array(6); //定义一个数组,长度为6.每个数组元素为undefined arr2=new Array(16,10);//定义一个数组,长度为2,其中第一个元素为16,第二个元素为10.如果 参数更多则含义一致

length属性是一个可读可写的属性,通过设置length属性值可以对数组进行裁剪

var brr=[1,2,3,4,5,6,7];
brr.length=3;//自动删除3个元素以后的元素
for(let k=0;kdocument.writeln(brr[k]);

数组的特点:


  • 数组长度可变, new Array(3) 当添加第4个元素时,数组长度自动改为4
  • 同一个数组中的元素类型可以互不相同
  • 访问数组元素不会产生数组越界问题,访问未赋值的数组元素时,值为undefined

函数

函数可以包含一段可执行的代码,也可以接收调用者传入参数

基础语法 function 函数名称(形参1,形参2,...){函数体;}


  • 特殊语法arguments

调用函数的语法 var res=函数名称(实参1,实参2,...);


运算符

通过运算符可以将变量连接成语句,语句是Javascript代码中的执行单位


赋值运算符

赋值运算符就是使用=将一个常量值赋值给变量,并支持连续赋值 a=b=c=d=7

加强赋值运算符+=、-=、*=、/=、%=,另外还有位运算符加强运算符&=、|=、^=、>=、 >>>=。所谓的加强运算符就是所有的双目运算符和赋值运算符的结合


a=a+b可以简写为a+=b



算术运算符

算术运算符用于执行基本的数学计算,例如加+、减-、乘*、除/、求余%、自加++和自减--。 a=a+++a+++a

其它特殊计算可以使用数学库类Math


  • 次方计算Math.pow(a,5)计算a的5次方
  • 平方根Math.sqrt(a)
  • 随机数Math.random()

位运算符

与&、或|、非~、异或^、左移位>、无符号右移位>>>


比较运算符        

大于>、大于等于>=、小于<、小于等于<=、等于==、不等于!=。这里注意针对string类型使用==进行比 较,不是equals方法

严格等于===、严格不等于!==

var str="13";
var kk="3";
document.write(str>kk); //false
var str="13";
var kk=3;
document.write(str>kk);//true

严格等于要求首先数据类型一致,然后比较其中内容,否则false


逻辑运算符

与&&、或||、非!,这里支持短路操作

注意:实际上逻辑运算还可以使用位运算符&和|,两者之间的区别是逻辑运算符支持短路操作,但是位 运算不支持短路操作


三目运算符

(逻辑表达式1)?(表达式2):(表达式3) ,完全可以使用if/else替代


逗号运算符

逗号运算符允许将多个表达式连在一起,其中使用逗号分隔,整个表达式返回最右边表达式的值

var a,b,c,d; //声明变量
a=(b=5,c=7,d=8); //这里给3个变量bcd赋值,整个表达式的执行结果实际上就是最后/最右边的值,
//d=8返回值8,则最终执行a=8

void运算符

void运算符用于强制指定表达式不会返回值。


a=void(b=5,c=7,d=8); //由于使用了void运算符,所以()中不会右返回值,最终a值为undefined



typeof和instanceof

typeof运算符用户判断变量的数据类型,typeof既可以当作运算符,也可以当作函数使用。

返回类型:undefined、null[Object]、boolean、number、string、object和function 

instanceof运算符用于判断变量是否为指定类型的实例,例如arr instanceof Array


语句

Javascript 脚本语言的基本构成是由控制语句、函数、对象、方法、属性等来实现编程的

Javascript是一种基于对象的事件驱动的设计语言,所以在编写程序的过程中要遇到各种各样的事件,所 以我们要给不同的事件设定一定的规则来控制该流程。

Javascript常用的流程控制有三种结构:顺序结构、选择结构、循环结构

语句块就是使用花括号{}包含的多个语句,但是语句块不能作为var变量的作用域


异常抛出语句

Javascript中的所有异常都是Error对象,抛出异常的语法 throw new Error(异常信息提示串) 。在程序 中一旦抛出异常则立即终止后续代码的执行,寻找可以处理异常的对应的异常捕捉代码块 catch。如果 没有对应的异常捕捉块,异常将传播给浏览器,程序非正常终止。

基础语法结构

try{
语句块;
} catch(e) {
可以通过e.message获取异常的描述信息,可以通过e.name获取异常的名称
} finally {
最终执行的代码块;
}

编码测试




js异常和java异常的区别:


  • js只有一个异常类Error,无需在定义异常时声明抛出,所以没有throws语句
  • js是弱类型语言,所以在catch语句中异常类型无需执行
  • js只有一个异常类,所以也只有一个catch语句
  • 获取异常的描述信息是通过异常对象的message属性,不是通过getMessage()方法实现的。

with语句

with是一种简化写法,使用with语句可以避免重复书写对象

with(document){
writeln("Hello world!"); //不用再写作document.writeln
}

流程控制


  • 流程控制:就是程序代码执行顺序
  • 流程控制:通过规定的语句让程序代码有条件的按照一定的方式执行
  • 按照结构编程的原理,任何程序都是由顺序结构、选择结构和循环结构三种结构组成

基本分支语句:if 或者 if/else、switch

循环语句:while、do/while、for、for/in循环、break和continue【注意可以使用语句标号】


分支选择

写法1: if(条件判断){语句块;}

写法2:if(条件判断){语句块1;} else {语句块2;}

写法3:


if(条件判断1){

语句块1;

} else if(条件判断2){

语句块2;

} else if(...){

......

} else {

语句块n;

}



开关分支结构

工作原理:首先设置表达式 (通常是一个变量)。随后表达式的值会与结构中的每个 case 的值做比 较。如果存在匹配,则与该 case 关联的代码块会被执行。请使用 break 来阻止代码自动地向下一个 case 运行 


switch(表达式){ case 常量值1: 代码块1; break; case 常量值2: 代码块2: break; ... ... default: 语句n; }



while循环

语法结构 while(条件判断){循环体;} ,反复执行循环体,直到条件不成立为止

阶乘值





用于显示执行结果


 do/while循环

do{
循环体;
}while(expression);

从1到输入正整数值的累加和


定义值变事件的回调函数,
调用回调函数时会将当前元素对象充当参数传递给函数,则可以省略获取输入元素的过程

1=1


for循环

for(初始化语句; 条件判断语句; 步长处理){
循环体;
}

九九乘法口诀表



for/in循环

for in循环本质上是一种foreach结构,可以遍历数组中的所有元素或者遍历js对象的所有属性


break和continue

continue用于终止本次循环,接着开始下一次循环

break用于完全终止循环,开始执行循环后续的代码

简单应用

终止标签

outer: 语句标号
for(var i=0; i<5; i++){
for( var k=0; k<5; k++){
document.write(&#39;k的值为:&#39;+k);
if(k>=2) break outer; //也允许continue outer;
document.write(&#39;i的值为:&#39;+i);
document.write(&#39;
&#39;);
}
}

函数

Javascript是一种基于对象的脚本语言,代码复用的单位就是函数,函数可以独立存在,也可以当作一个 类使用,同时函数也是一个对象,是Function类的实例


函数定义

函数最大作用就是提供代码复用,将需要重复使用的代码定义为函数,提供方便的复用策略。

定义方法1:命名函数

function 函数名称(形式参数){代码块;}

调用方法 函数名称(实际参数)

定义方法2:匿名函数 function(形式参数) {代码块}

var f=function(name){document.write(&#39;hello &#39;+name+’!‘);}

调用方法为 f(&#39;yanjun&#39;);

定义方法3:可以使用Function类定义匿名函数

基础语法 var f=new Function(&#39;name形式参数名称&#39;,&#39;document.writeln("定义的函数 体");document.writeln("hello "+name+"!");&#39;);

调用方法 f("yanjun")


推荐阅读
  • 本文详细介绍了 PHP 中对象的生命周期、内存管理和魔术方法的使用,包括对象的自动销毁、析构函数的作用以及各种魔术方法的具体应用场景。 ... [详细]
  • Ihavetwomethodsofgeneratingmdistinctrandomnumbersintherange[0..n-1]我有两种方法在范围[0.n-1]中生 ... [详细]
  • 重要知识点有:函数参数默许值、盈余参数、扩大运算符、new.target属性、块级函数、箭头函数以及尾挪用优化《深切明白ES6》笔记目次函数的默许参数在ES5中,我们给函数传参数, ... [详细]
  • 第二十五天接口、多态
    1.java是面向对象的语言。设计模式:接口接口类是从java里衍生出来的,不是python原生支持的主要用于继承里多继承抽象类是python原生支持的主要用于继承里的单继承但是接 ... [详细]
  • 技术分享:使用 Flask、AngularJS 和 Jinja2 构建高效前后端交互系统
    技术分享:使用 Flask、AngularJS 和 Jinja2 构建高效前后端交互系统 ... [详细]
  • 2.2 组件间父子通信机制详解
    2.2 组件间父子通信机制详解 ... [详细]
  • 在处理大规模数据数组时,优化分页组件对于提高页面加载速度和用户体验至关重要。本文探讨了如何通过高效的分页策略,减少数据渲染的负担,提升应用性能。具体方法包括懒加载、虚拟滚动和数据预取等技术,这些技术能够显著降低内存占用和提升响应速度。通过实际案例分析,展示了这些优化措施的有效性和可行性。 ... [详细]
  • POJ 2482 星空中的星星:利用线段树与扫描线算法解决
    在《POJ 2482 星空中的星星》问题中,通过运用线段树和扫描线算法,可以高效地解决星星在窗口内的计数问题。该方法不仅能够快速处理大规模数据,还能确保时间复杂度的最优性,适用于各种复杂的星空模拟场景。 ... [详细]
  • Web开发框架概览:Java与JavaScript技术及框架综述
    Web开发涉及服务器端和客户端的协同工作。在服务器端,Java是一种优秀的编程语言,适用于构建各种功能模块,如通过Servlet实现特定服务。客户端则主要依赖HTML进行内容展示,同时借助JavaScript增强交互性和动态效果。此外,现代Web开发还广泛使用各种框架和库,如Spring Boot、React和Vue.js,以提高开发效率和应用性能。 ... [详细]
  • 本文探讨了使用JavaScript在不同页面间传递参数的技术方法。具体而言,从a.html页面跳转至b.html时,如何携带参数并使b.html替代当前页面显示,而非新开窗口。文中详细介绍了实现这一功能的代码及注释,帮助开发者更好地理解和应用该技术。 ... [详细]
  • 解决Bootstrap DataTable Ajax请求重复问题
    在最近的一个项目中,我们使用了JQuery DataTable进行数据展示,虽然使用起来非常方便,但在测试过程中发现了一个问题:当查询条件改变时,有时查询结果的数据不正确。通过FireBug调试发现,点击搜索按钮时,会发送两次Ajax请求,一次是原条件的请求,一次是新条件的请求。 ... [详细]
  • 秒建一个后台管理系统?用这5个开源免费的Java项目就够了
    秒建一个后台管理系统?用这5个开源免费的Java项目就够了 ... [详细]
  • 深入解析:Synchronized 关键字在 Java 中对 int 和 Integer 对象的作用与影响
    深入探讨了 `Synchronized` 关键字在 Java 中对 `int` 和 `Integer` 对象的影响。尽管初看此题似乎简单,但其实质在于理解对象的概念。根据《Java编程思想》第二章的观点,一切皆为对象。本文详细分析了 `Synchronized` 关键字在不同数据类型上的作用机制,特别是对基本数据类型 `int` 和包装类 `Integer` 的区别处理,帮助读者深入理解 Java 中的同步机制及其在多线程环境中的应用。 ... [详细]
  • 如何使用ES6语法编写Webpack配置文件? ... [详细]
  • 为开发者提供了一系列实用的参考网站和资源链接,包括HTML速查手册( 和 ),帮助开发者快速查找和学习相关技术知识。此外,还涵盖了其他重要的开发工具和文档,为编程工作提供全面支持。 ... [详细]
author-avatar
宁波慈城老朋友客栈
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有