JavaScript 对象 实例

作者: hx永恒之恋 | 来源:发表于2016-12-12 16:03 被阅读17次

JavaScript String(字符串)对象 实例
返回字符串的长度
var txt="Hello World!" document.write(txt.length)
为字符串添加样式(<==看效果点击此处)
txt.big() 用大号字体显示字符串
txt.small() 小字体
txt.bold() 粗体
txt.italics() 斜体
txt.blick() 显示闪动字符串
txt.fixed() 以打字机文本显示字符串
txt.strike() 字体上划横线
txt.fontcolor("Red") 字体变红色
txt.fontsize(16) 使用指定的尺寸来显示字符串
txt.toLowerCase() 字母全部小写
txt.toUpperCase() 字母全部大写
txt.sub() 集体向下偏移(下角标模式)
txt.sup() 集体向上偏移(上角标模式)
txt.link("http://www.w3school.com.cn") 将字符串显示为链接

<body>

<script type="text/javascript">

var txt="Hello World!"

document.write("<p>Big: " + txt.big() + "</p>")
document.write("<p>Small: " + txt.small() + "</p>")

document.write("<p>Bold: " + txt.bold() + "</p>")
document.write("<p>Italic: " + txt.italics() + "</p>")

document.write("<p>Blink: " + txt.blink() + " (does not work in IE)</p>")
document.write("<p>Fixed: " + txt.fixed() + "</p>")
document.write("<p>Strike: " + txt.strike() + "</p>")

document.write("<p>Fontcolor: " + txt.fontcolor("Red") + "</p>")
document.write("<p>Fontsize: " + txt.fontsize(16) + "</p>")

document.write("<p>Lowercase: " + txt.toLowerCase() + "</p>")
document.write("<p>Uppercase: " + txt.toUpperCase() + "</p>")

document.write("<p>Subscript: " + txt.sub() + "</p>")
document.write("<p>Superscript: " + txt.sup() + "</p>")

document.write("<p>Link: " + txt.link("http://www.w3school.com.cn") + "</p>")
</script>

</body>

返回字符串中指定文本首次出现的位置 indexOf()方法

<body>

<script type="text/javascript">

var str="Hello world!"
document.write(str.indexOf("Hello") + "<br />") // 0
document.write(str.indexOf("World") + "<br />")  // -1(未发现该字符串返回-1)
document.write(str.indexOf("world"))  // 6

</script>

</body>

查找字符串中特定的字符,若找到,则返回该字符 match() 方法

<body>

<script type="text/javascript">

var str="Hello world!"
document.write(str.match("world") + "<br />")  // world
document.write(str.match("World") + "<br />")  // null
document.write(str.match("worlld") + "<br />")  // null
document.write(str.match("world!"))  // world!

</script>

</body>

替换字符串中的字符 replace()

<body>

<script type="text/javascript">

var str="Visit Microsoft!"
document.write(str.replace(/Microsoft/,"W3School"))  // Visit W3School!

</script>
</body>

参阅:JavaScript String 对象参考手册

JavaScript String 对象参考图片.png

String 对象描述
字符串是 JavaScript 的一种基本的数据类型。

  1. String 对象的 length 属性声明了该字符串中的字符数。
  2. String 类定义了大量操作字符串的方法,例如从字符串中提取字符或子串,或者检索字符或子串。
  3. 需要注意的是,JavaScript 的字符串是不可变的(immutable),String 类定义的方法都不能改变字符串的内容。像 String.toUpperCase() 这样的方法,返回的是全新的字符串,而不是修改原始字符串。
  4. 在较早的 Netscape 代码基的 JavaScript 实现中(例如 Firefox 实现中),字符串的行为就像只读的字符数组。
    例如,从字符串 s 中提取第三个字符,可以用 s[2] 代替更加标准的 s.charAt(2)。此外,对字符串应用 for/in 循环时,它将枚举字符串中每个字符的数组下标(但要注意,ECMAScript 标准规定,不能枚举 length 属性)。因为字符串的数组行为不标准,所以应该避免使用它。

JavaScript Date(日期)对象 实例
使用 Date()方法来返回今天的日期和时间

<body>

<script type="text/javascript">

document.write(Date())    

</script>

</body> 

使用getTime() 计算从1970年到今天有多少年

<body>

<script type="text/javascript">
var d=new Date();
document.write("从 1970/01/01 至今已有:" + d.getTime() + " 毫秒。");
</script>

</body>

使用setFullYear() 设置具体的日期

<body>

<script type="text/javascript">

var d = new Date()
d.setFullYear(1992,10,3)
document.write(d)  // Tue Nov 03 1992 14:59:14 GMT+0800 (中国标准时间)

</script>

</body>

使用 toUTCString() 把当日的日期(根据 UTC)转换为字符串

<body>

<script type="text/javascript">

var d = new Date()
document.write (d.toUTCString())

</script>

</body>

使用 getDay() 来显示星期,而不仅仅是数字

<body>

<script type="text/javascript">

var d=new Date()
var weekday=new Array(7)
weekday[0]="星期日"
weekday[1]="星期一"
weekday[2]="星期二"
weekday[3]="星期三"
weekday[4]="星期四"
weekday[5]="星期五"
weekday[6]="星期六"

document.write("今天是" + weekday[d.getDay()])

</script>

</body>

显示一个钟表

<head>
<script type="text/javascript">
function startTime()
{
var today=new Date()
var h=today.getHours()
var m=today.getMinutes()
var s=today.getSeconds()
// add a zero in front of numbers<10
m=checkTime(m)
s=checkTime(s)
document.getElementById('txt').innerHTML=h+":"+m+":"+s
t=setTimeout('startTime()',500)
}

function checkTime(i)
{
if (i<10) 
  {i="0" + i}
  return i
}
</script>
</head>

<body onload="startTime()">
<div id="txt"></div>
</body>

创建 Date 对象的语法:
var myDate=new Date()
注释:Date 对象会自动把当前日期和时间保存为其初始值。

参阅:JavaScript Date 对象参考手册

JavaScript Date 对象参考图

JavaScript Array(数组)实例
创建数组var myArr = new Array()
使用for...in声明来遍历数组中的元素

<body>

<script type="text/javascript">
// 创建数组
var mycars = new Array()
mycars[0] = "Saab"
mycars[1] = "Volvo"
mycars[2] = "BMW"
// 使用 for...in 声明来遍历数组中的元素
for (i=0;i<mycars.length;i++)
{
document.write(mycars[i] + "<br />")
}
</script>

</body>

合并两个数组 concat()

<body>

<script type="text/javascript">

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

var arr2 = new Array(3)
arr2[0] = "James"
arr2[1] = "Adrew"
arr2[2] = "Martin"

document.write(arr.concat(arr2))  // George,John,Thomas,James,Adrew,Martin
</script>

</body>

用数组的元素组成字符串 join()

<body>

<script type="text/javascript">

var arr = new Array(3);
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

document.write(arr.join());  // George,John,Thomas

document.write("<br />");

document.write(arr.join("."));  // George.John.Thomas

</script>

</body>

文字数组 sort()

<body>

<script type="text/javascript">

var arr = new Array(6)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
arr[3] = "James"
arr[4] = "Adrew"
arr[5] = "Martin"

document.write(arr + "<br />")  // George,John,Thomas,James,Adrew,Martin
document.write(arr.sort())      // Adrew,George,James,John,Martin,Thomas

</script>

</body>

数字数组 sort()

<body>

<script type="text/javascript">

function sortNumber(a, b)
{
return a - b  // 升序排列   若为:b - a 降序排列
}

var arr = new Array(6)
arr[0] = "10"
arr[1] = "5"
arr[2] = "40"
arr[3] = "25"
arr[4] = "1000"
arr[5] = "1"

document.write(arr + "<br />")        // 10,5,40,25,1000,1
document.write(arr.sort(sortNumber))  // 1,5,10,25,40,1000  若为b - a 降序排列:1000,40,25,10,5,1

</script>

</body>

参阅:JavaScript Array 对象的参考手册

JavaScript Array 对象的参考图.png
JavaScript Boolean(布尔)对象 实例
检查逻辑值
<body>

<script type="text/javascript">
var b1=new Boolean( 0)
var b2=new Boolean(1)
var b3=new Boolean("")
var b4=new Boolean(null)
var b5=new Boolean(NaN)
var b6=new Boolean("false")

document.write("0 是逻辑的 "+ b1 +"<br />")  // 0 是逻辑的 false
document.write("1 是逻辑的 "+ b2 +"<br />")  // 1 是逻辑的 true
document.write("空字符串是逻辑的 "+ b3 + "<br />")  // 空字符串是逻辑的 false
document.write("null 是逻辑的 "+ b4+ "<br />")  // null 是逻辑的 false
document.write("NaN 是逻辑的 "+ b5 +"<br />")  // NaN 是逻辑的 false
document.write("字符串 'false' 是逻辑的 "+ b6 +"<br />")  // 字符串 'false' 是逻辑的 true
</script>

</body>

参阅:JavaScript Boolean 对象的参考手册
toSource() 方法返回表示对象源代码的字符串。
语法object.toSource()

提示和注释
注释:该方法在 Internet Explorer 中无效。
下面的例子向您展示 toSource() 方法的用法:

<script type="text/javascript">
function employee(name,job,born)
{
this.name=name;
this.job=job;
this.born=born;
}
var bill=new employee("Bill Gates","Engineer",1985);
document.write(bill.toSource());
</script>

输出:({name:"Bill Gates", job:"Engineer", born:1985})

toString() 方法可把一个逻辑值转换为字符串,并返回结果。
语法booleanObject.toString()

提示和注释
如果调用该方法的对象不是 Boolean,则抛出异常 TypeError。
注释:在 Boolean 对象被用于字符串环境中时,此方法会被自动调用。

<script type="text/javascript">

 var boo = new Boolean(true)
document.write(boo.toString())

</script>

输出:true
valueOf() 方法可返回 Boolean 对象的原始值。
语法booleanObject.valueOf()

抛出
如果调用该方法的对象不是 Boolean,则抛出异常 TypeError。

<script type="text/javascript">

var boo = new Boolean(false)
document.write(boo.valueOf())

</script>

输出:false

JavaScript Math(算数对象)实例
使用 round()对数字进行舍入

<body>

<script type="text/javascript">

document.write(Math.round(0.60) + "<br />")    // 1
document.write(Math.round(0.50) + "<br />")    // 1
document.write(Math.round(0.49) + "<br />")    // 0
document.write(Math.round(-4.40) + "<br />")   // -4
document.write(Math.round(-4.60))              // -5

</script>

</body>

使用 random()来返回 0 到 1 之间的随机数

<body>

<script type="text/javascript">

document.write(Math.random())

</script>

</body>

使用 max() 来返回两个给定的数中的较大的数

<body>

<script type="text/javascript">

document.write(Math.max(5,7) + "<br />")      // 7
document.write(Math.max(-3,5) + "<br />")     // 5
document.write(Math.max(-3,-5) + "<br />")    // -3
document.write(Math.max(7.25,7.30))           // 7.3

</script>

</body>

使用 min() 来返回两个给定的数中的较小的数

<body>

<script type="text/javascript">

document.write(Math.min(5,7) + "<br />")    // 5
document.write(Math.min(-3,5) + "<br />")   // -3
document.write(Math.min(-3,-5) + "<br />")  // -5
document.write(Math.min(7.25,7.30))         // 7.25

</script>

</body>

参阅:JavaScript Math 对象的参考手册

JavaScript Math 对象的参考图.png

相关文章

  • JS 实例

    JavaScript 实例JavaScript 对象 实例JavaScript Browser 对象 实例Java...

  • JS Class

    JavaScript 语言中,生成实例对象的传统方法是通过构造函数 JavaScript语言中,生成实例对象的传统...

  • JavaScript 对象 实例

    JavaScript String(字符串)对象 实例返回字符串的长度var txt="Hello World!"...

  • JavaScript学习笔记3—面向对象编程

    JavaScript—面向对象编程 JavaScript不区分类和实例的概念,而是通过原型(prototype)来...

  • javascript promise 对象实例

    下面是js简单的一个promise对象实例 运行结果 参考: https://developer.mozilla....

  • Javascript构造函数

    javascript构造函数1.内含this指针,指向实例化的对象使用new来创建一个实例化对象 结果为: 这里和...

  • JavaScript new 关键字

    new 关键字 在JavaScript中, new 关键字用来创建一个类(模拟类)的实例对象。 实例化对象之后, ...

  • JavaScript原型

    JavaScript Prototype js基于对象,任何元素都可以看成对象。 原型方法一般用于对象实例...

  • (十)Object对象

    1 概述 JavaScript 的所有其他对象都继承自Object对象,即那些对象都是Object的实例。 Obj...

  • JS面向对象

    面向对象编程 实例对象与 new 命令 JavaScript 语言具有很强的面向对象编程能力,这里介绍 JavaS...

网友评论

    本文标题:JavaScript 对象 实例

    本文链接:https://www.haomeiwen.com/subject/kmummttx.html