day12—JavaScript基础

最新推荐文章于 2024-04-18 22:30:21 发布

小圣_fighting

最新推荐文章于 2024-04-18 22:30:21 发布

阅读量573

点赞数 3

分类专栏：学习笔记 html 文章标签： javascript 脚本语言

本文链接：https://blog.csdn.net/xie_xiansheng/article/details/50864460

版权

学习笔记同时被 2 个专栏收录

81 篇文章 0 订阅

订阅专栏

html

27 篇文章 0 订阅

订阅专栏

JavaScript

应用方式
语法规范
流程控制
常用内置对象
window对象

什么是JavaScript：

JavaScript是一种基于对象和事件驱动的客户端脚本语言，同时也是一种广泛应用于客户端Web开发的脚本语言，常用来给HTML网页添加

动态功能，比如响应用户的各种操作。
JavaScript 作为一种脚本语言（脚本语言是一种轻量级的编程语言），可以向 HTML 页面添加交互行为，通常被直接嵌入 HTML 页面。

JavaScript作为客户端程序嵌入网页有三种方式:
直接在HTML标记中(事件处理程序中使用JavaScript)
使用script标记
使用外部文件

嵌入式：<script> 标签
可以在页面上嵌入 <script></script> 标签，并在标签中放置 JavaScript 代码，然后在 HTML 元素的事件中调用它。

<script type="text/javascript" language="javascript" >
                function method1() {
                    alert("hello in method1.");
                }
          </script>

文件调用方式：js 文件
可以将 JavaScript 代码写入一个单独的文件，并保存为后缀为 js 的文件，然后在html 页面的 <head> 中引用外部的 .js 文件。

<script language="JavaScript" src="myJS.js"  
                type="text/javascript">
          </script>

语法规范
JavaScript 是一种弱类型的语言，因此，在变量声明时，使用 var 关键字即可，不用指定变量的数据类型，代码如下所示：
var a = 10; var b = 'abc' var x;
没有初始化的变量则自动取值为 undefined。
变量命名同标识符的规则，且大小写敏感。

数据类型转换函数
toString()：转换成字符串，所有数据类型均可转换为 string 类型；
parseInt()：强制转换成整数，如果不能转换，则返回 NaN（not a number）；
parseFloat()：强制转换成浮点数，如果不能转换，则返回 NaN
typeof()：查询数值当前类型，返回 string / number / boolean / object；
isNaN()：判断是否为数值，返回 true/false。

JavaScript常用内置对象
简单对象：String、Number、Boolean
组合对象：Array、Math、Date
复杂对象：Function、Regex、Object等

x.toLowerCase()、x.toUpperCase()：大小写转换方法；
x.charAt(index)：返回指定位置的字符；
x.charCodeAt(index)：返回指定位置字符的Unicode编码；
x.indexOf(findstr,index)、x.lastIndexOf(findstr,index)：获取指定字符；
x.substring(start, end)：获取子字符串；
x.replace(findstr,tostr)：替换子字符串；
x.split(bystr)：拆分子字符串。

ps:通常可以用x.lastIndexOf(findstr,index)和x.substring(start, end)方法结合使用，获取文件后缀名

String 对象的 replace、split、search和 match 方法经常结合正则表达式使用，以实现更为复杂的功能。比如：
var str1 = "abc123def";
var str2 = str1.replace(/\d/gi,"*");
alert(str2);//abc***def
var array = str1.match(/\d/g);
alert(array.toString());//1,2,3
var index = str1.search(/\d/);
alert(index);//3
上述代码中，“/\d/g“是一个正则表达式，结合string 对象的replace方法使用，将替换所有的数字；而match方法将返回所有的数字所组成的数组；search方法将返回复合条件的第一个子字符串的位置。

Array 对象

Array 对象用于在单个的变量中存储多个值。创建 Array 对象的语法：
new Array(); length 字段为 0
new Array(size); length 字段为 size
var arr = [12,true,”aaa”]; // 简单数组创建
需要注意的是，JavaScript 本身是一种弱类型的语言，因此，在数组中，也可以存入不同数据类型的数值。

Array 对象的常用方法
1、join() 方法。把数组中的所有元素放入一个字符串，元素是通过指定的分隔符进行分隔的。
arrayObject.join(separator) //参数 separator可选，表示要使用的分隔符。如果省略该参数，则使用逗号作为分隔符。

2、toString() 方法
某些情况下，需要显式地调用该方法。

3、concat() 方法，用于连接两个或多个数组，该方法不会改变现有的数组，而仅仅会返回被连接数组的一个副本。
arrayObject.concat(arrayX,arrayX,......,arrayX)

4、slice() 方法
arrayObject.slice(start,end) 从已有的数组中返回选定的元素。

Array数组倒转与排序
1、reverse() 方法
arrayObject.reverse()用于颠倒原数组中元素的顺序。

2、sort() 方法
arrayObject.sort(sortby)用于对数组的元素进行排序。

Math 对象

Math 对象用于执行数学任务
Math 对象的常用属性都是数学常数，如Math.E（自然数）、Math.PI（圆周率）、Math.LN2（ln2）、Math.LN10 （ln10）等。
其他常用属性和方法：
三角函数：Math.sin(x) 、 Math.cos(x)、 Math.tan(x) 等；
反三角函数：Math.asin(x) 、 Math.acos(x) 等；
计算函数：Math. sqrt(x) 、 Math.log(x) 、 Math.exp(x)等；
数值比较函数：Math.abs(x)、 Math.max(x,y,...)、Math.random( )、 Math.round(x)、Math.pow(底数,几次方)等。

ps：其中 Math.random( )—取0~1间的随机数，Math.pow(底数,几次方)比较常用

Number 对象

Number 对象是原始数值的包装对象。创建 Number 对象的语法如下
var myNum=new Number(value);
var myNum=Number(value);

Number 对象的常用方法
1、toString(radix) 方法
2、NumberObject.toFixed(num)方法 //常用
四舍五入为指定小数位数的数字。

RegExp 对象

RegExp 对象表示正则表达式，它是对字符串执行模式匹配的强大工具。创建正则表达式对象有两种方式：
直接量语法:
/pattern/attributes
创建 RegExp 对象的语法：
new RegExp(pattern, attributes);

其中，参数 pattern 是一个字符串，指定了正则表达式的模式或其他正则表达式；参数 attributes 是一个可选的字符串，包含属性 "g"、"i" 和 "m"，分别用于指定全局匹配、区分大小写的匹配和多行匹配。
如果 pattern 不是合法的正则表达式，或 attributes 含有 "g"、"i" 和 "m" 之外的字符，则会抛出异常。

RegExp 对象的常用方法
正则表达式对象在 JavaScript 中，除了可以配合 String 对象的 split/replace/search/match 方法使用之外，还可以使用正则表达式对象自身的方法，实现对文本字符串的匹配测试。

正则表达式对象最常用的方法就是 test() 。该方法用于检测一个字符串是否匹配某个模式，语法如下：
RegExpObject.test(string)

Date对象

Date 对象用于处理日期和时间。创建 Date 对象的语法如下：
var nowDate=new Date()
使用上述代码创建 Date 对象时，会自动把当前日期和时间保存为其初始值。
也可以在创建 Date 对象时，指定其日期和时间，代码如下所示：
var myDate=new Date("2014/3/20 11:12");

Date 对象的常用方法分为三种：

1、获取日期数据
getDate()、getDay()、getFullYear()、getMonth()等。// 日，星期几，年，月
2、修改日期数据
setDate()、setDay()、setFullYear()、getMonth()等。
3、获取日期格式的字符串
toString()、toLocaleTimeString()、toLocaleDateString()等。 //第二个函数返回单天的时分秒，第三个函数返回当天的年月日

Function 对象
函数是定义一次却可以调用或执行任意多次的一段 JavaScript 代码。在 JavaScript 中，函数实际上是功能完整的对象，Function 类可以表示开发者定义的任何函数。

不传递参数
function subname(){}
传递参数
function subname(p1){}
传递多个参数
function subname(p1,p2){}
返回值
function subname(p1){return p;}

window 对象

所有浏览器都支持 window 对象，所有的 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员。因为它是全局对象，表示最顶层的浏览器窗口，要引用当前窗口对象调用方法只需要写方法即可。
window 对象的常用属性有：
document：窗口中显示的 HTML 文档对象
history：浏览过窗口的历史记录对象
location：窗口文件地址对象
navigator：有关浏览器的信息
event：事件对象
screen：屏幕对象
name：窗口名称
opener：打开当前窗口的 window 对象

window 对象的常用方法有：
alert(),confirm,prompt()：对话框
close(),open()：关闭、打开窗口
focus(),blur()：窗口获得焦点或者失去焦点
moveBy(),moveTo()移动窗口
resizeBy(),resizeTo()：调整窗口大小
scrollBy(),scrollTo()：滚动窗口中网页的内容

窗口和对话框
1、alert(message)用于显示带有一条指定消息和一个 OK 按钮的警告框
2、confirm(message)
用于显示一个带有指定消息和 OK 及取消按钮的对话框。
其中，参数 message要在 window 上弹出的对话框中显示的纯文本（而非 HTML 文本）。如果用户点击确定按钮，则 confirm() 返回 true。如果点击取消按钮，则 confirm() 返回 false。
3、prompt(text,defaultText)
用于显示可提示用户进行输入的对话框。其中参数 text 可选，为要在对话框中显示的纯文本，参数 defaultText 也是可选的，表示默认的输入文本。

窗口的打开和关闭
window.open(URL,name,features,replace)
用于打开一个新的浏览器窗口或查找一个已命名的窗口

URL：一个可选的字符串，声明了要在新窗口中显示的文档的 URL。如果省略了这个参数，或者它的值是空字符串，那么新窗口就不会显示任何文档。
name：一个可选的字符串，该字符串是一个由逗号分隔的特征列表，其中包括数字、字母和下划线，该字符声明了新窗口的名称。这个名称可以用作标记 <a> 和 <form> 的属性 target 的值。如果该参数指定了一个已经存在的窗口，那么 open() 方法就不再创建一个新窗口，而只是返回对指定窗口的引用。在这种情况下，features 将被忽略。
features：一个可选的字符串，声明了新窗口要显示的标准浏览器的特征。如果省略该参数，新窗口将具有所有标准特征。
replace：一个可选的布尔值。规定了装载到窗口的 URL 是在窗口的浏览历史中创建一个新条目，还是替换浏览历史中的当前条目。

定时器

通过使用 JavaScript，可以作到在一个设定的时间间隔之后来执行代码，而不是在函数被调用后立即执行，我们称之为定时事件。定时器多用于网页动态时钟、制作倒计时、跑马灯效果等。有两种定时器：
周期性时钟：以一定的间隔执行代码，循环往复
一次性时钟：在一个设定的时间间隔之后来执行代码

周期性定时器

按照指定的周期（以毫秒计）来调用函数或计算表达式，且不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。

setInterval(code,millisec[,"lang"])

参数 code 必需，表示要调用的函数或要执行的代码串；
参数 millisec 也是必需，表示周期性执行或调用 code 之间的时间间隔，以毫秒计。
该方法返回所启动的定时器对象，可以传递给 Window.clearInterval() 从而取消对 code 的周期性执行的值。

一次性定时器

用于启动一个一次性定时器，该方法在指定的毫秒数后调用函数或计算表达式。语法如下：

setTimeout(code,millisec)

参数 code 必需，是要调用的函数后要执行的 JavaScript 代码串；millisec 也是必需的，表示在执行代码前需等待的毫秒数。
需要注意的是，setTimeout() 只执行 code 一次。如果需要实现多次调用的效果，请使用 setInterval() 或者让 code 自身再次调用 setTimeout()。
clearTimeout() 方法可取消由 setTimeout() 方法设置的 timeout，只需要传入由 setTimeout() 返回的 ID 值即可。

小圣_fighting

关注

3
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
day12—JavaScript基础

JavaScript应用方式语法规范流程控制常用内置对象window对象什么是JavaScript：JavaScript是一种基于对象和事件驱动的客户端脚本语言，同时也是一种广泛应用于客户端Web开发的脚本语言，常用来给HTML网页添加动态功能，比如响应用户的各种操作。JavaScript 作为一种脚本语言（脚本语言是一种轻量级的编程语言），可以
复制链接

扫一扫