JS_06_数组_字符串_正则_常见对象

最新推荐文章于 2022-10-31 09:00:00 发布

pre_eminent

最新推荐文章于 2022-10-31 09:00:00 发布

阅读量847

点赞数 1

分类专栏： # JS/ES6 文章标签： JS JavaScript 字符串数组正则

本文链接：https://blog.csdn.net/pre_eminent/article/details/79676179

版权

JS/ES6 专栏收录该内容

19 篇文章 0 订阅

订阅专栏

JavaScript 对象

JavaScript 中的所有事物都是对象：字符串、(数值)、数组、函数...

此外，JavaScript 允许自定义对象。

所有事物都是对象

JavaScript 提供多个内建对象，比如 String、Date、Array 等等。

对象只是带有属性和方法的特殊数据类型。

布尔型可以是一个对象。
数字型可以是一个对象。
字符串也可以是一个对象
日期是一个对象
数学和正则表达式也是对象
数组是一个对象
甚至函数也可以是对象, 函数是JS世界的一等公民

JavaScript 对象

对象只是一种特殊的数据。

对象拥有属性和方法。

访问对象的属性

属性是与对象相关的值。

访问对象属性的语法是：

 
    objectName.propertyName 
   
     或objectName['propertyName'] // 用中括号时,属性名必须加引号

这个例子使用了 String 对象的 length 属性来获得字符串的长度：

     var message = "Hello Beyond!"; 
    
 var len = message.length;

在以上代码执行后，len 的值将是：

13

访问对象的方法

方法是能够在对象上执行的动作。

您可以通过以下语法来调用方法：

 
    objectName.methodName(); 
   
     或objectName['methodNmae'](); // 注意:属性名必须加引用

这个例子使用了 String 对象的 toUpperCase() 方法来将文本转换为大写：

     var message = "hello beyond~"; 
    
 var x = message.toUpperCase();

在以上代码执行后，x 的值将是：

     HELLO BEYOND~ 
   

创建 JavaScript 对象

通过 JavaScript，您能够定义并创建自己的对象。

注意: 在JS中, 创建 新对象 有 2种不同的方法：

1. 定义的同时,创建对象的实例
2. 使用函数先定义对象，然后再创建新的对象实例

创建直接的实例

这个例子创建了对象的一个新实例，并向其添加了四个属性：

实例

     girl = new Object(); 
    
girl.name = "面码"; 
    
girl.age = 13; 
    
girl.cup = "A";

替代语法（使用对象字面量literals）：

实例

     var girl = {name: "面码",age: 13,cup: "A"}; 
   

使用对象构造器 (即构造函数)

本例使用函数来构造对象：

实例

     function Girl(name,age,cup) 
    
{ 
    
    this.name = name; 
    
    this.age = age; 
    
    this.cup = cup; 
    
}

在JavaScript中，this通常指向的是我们正在执行的函数本身，或者是指向 该函数所属的对象（运行时）

具体,请参看前面JavaScript函数一章节中关于this的分析判断!

创建 JavaScript 对象实例

一旦您有了对象构造器，就可以通过new, 创建新的对象实例，就像这样：

     var menma = new person("面码",13,"AA"); 
    
 var mathilda = new person("mathilda",12,"A");

把属性添加到 JavaScript 对象

您可以通过为对象的新属性 赋值的形式，向已有对象动态添加 新属性：

假设 girlObject 已存在 ,

您可以为其添加这些新属性：name、age 以及 cup：

     girl.name = "面码"; 
    
 girl.age = 13; 
    
 girl.cup = "A"; 
    
 var message = girl.name + ...;

在以上代码执行后，message 的值将是：

     面码's age is 13岁, A ... 
   

把方法添加到 JavaScript 对象

方法只不过是附加在对象上的函数而已。

下面是: 在 构造器函数内部 定义对象的方法：

     function person(firstname,lastname,age,eyecolor) 
    
 { 
    
 this.firstname=firstname; 
    
 this.lastname=lastname; 
    
 this.age=age; 
    
 this.eyecolor=eyecolor; 
    
 this.changeName=changeName; 
    
 function changeName(name) 
    
 { 
    
 this.lastname=name; 
    
 } 
    
 }

changeName() 函数 name 的值赋给 person 的 lastname 属性。

现在您可以试一下：

     myMother.changeName("Doe"); 
   

JavaScript 类

JavaScript 是面向对象的语言，
但是,千万注意: JavaScript 不使用类。

在 JavaScript 中，永远都不会创建类，

更不会通过类来创建对象（完全不同于其他面向对象的语言那样）。

注意: JavaScript 基于 prototype，而 不是基于类的。

JavaScript for...in 循环

JavaScript for...in 语句循环遍历对象的属性。

语法

     for (variable in object) 
    
 { 
    
   code to be executed 
    
 }

注意： for...in 循环中的代码块将针对每个属性执行一次。

实例

循环遍历对象的属性：

实例

     var girl = {name: "面码",age: 13,cup: "A"};  
    
for (propertyName in girl) 
    
  { 
    
    console.log(propertyName + " : " +girl[propertyName]); // 这不能用点语法 
    
  }

下面给出一个完整简易的dictionary实现。

注意其外部使用了function，

内部使用了Object对象的动态添加属性的一些特性。

代码如下:

        <script type="text/javascript">
            // 自己实现一个字典
            function BeyondMap (argument) {
                var _map = new Object();
                // 查询是否已经包含了key
                this.isKeyExist = function(keyParam){
                    // 默认未包含
                    var isKeyExist = false;
                    for(var keyStr in _map){
                        if(keyStr == keyParam){
                            isKeyExist = true;
                            break;
                        }
                    }
                    return isKeyExist;
                };
                // 添加一个新的键值对
                this.addKeyValue = function(keyStr,valueStr){
                    // 只有key 不存在时,才添加
                    
                    if (this.isKeyExist(keyStr)) {
                        // key已经 存在,是覆盖
                        _map[keyStr] = valueStr;    
                    } else{
                        // key不存在,才是添加
                        _map[keyStr] = valueStr;
                    }
                }; 
                // 移除一个键值对
                this.removeKeyValue = function (keyStr) {
                    // 只有包含该key的时候,才能移除
                    if (this.isKeyExist(keyStr)) {
                        delete _map[keyStr];
                    }
                }
                // 打印对象
                this.toString = function () {
                    // stringify方法: 
                    // 将一个JavaScript值(对象或者数组)转换为一个 JSON字符串
                    var str = JSON.stringify(_map);
                    return str;
                }
            }
            // end of class

            // 新建一个自定义的map
            var beyondMap = new BeyondMap();
            beyondMap.addKeyValue("name","未闻花名");
            beyondMap.addKeyValue("episodes","11集");
            beyondMap.addKeyValue("actress","面码");
            beyondMap.addKeyValue("description","我们仍未知道那年夏天所见到的花的名字");
            // 打印自定义的map
            NSLog(beyondMap.toString());
            // 删除一个键值对
            beyondMap.removeKeyValue('description');
            // 打印自定义的map
            NSLog(beyondMap.toString());
        </script>

效果如下:

JavaScript Boolean（布尔）对象

Boolean（布尔）对象用于将非布尔值转换为布尔值（不是true 就是 false）。

Boolean（布尔）对象是3种包装对象：Boolean、Number、String中最简单的一种，它没有大量的实例属性和方法。

在线实例

检查布尔值
检查布尔对象是 true 还是 false (8种情形)。

完整的 Boolean（布尔）对象参考手册

我们提供 JavaScript Boolean 对象参考手册，其中包括所有可用于布尔对象的属性和方法。

该手册包含了对每个属性和方法的详细描述以及相关实例。

Boolean 对象属性

属性	描述
constructor	返回对创建此对象的 Boolean 函数的引用
prototype	使您有能力向对象动态添加新的属性和方法。

Boolean 对象方法

方法	描述
toString()	把布尔值转换为字符串，并返回结果。
valueOf()	返回 Boolean 对象的原始值。

创建 Boolean 对象

Boolean 对象代表两个值:"true" 或者 "false"

下面的代码定义了一个名为 myBoolean 的布尔对象：

     var myBoolean=new Boolean(); 
   

如果布尔对象无初始值或者其值为: 共8种情况

0
-0
null
""
false
undefined
NaN

那么对象的值为 false。

否则，其值为 true（即使当自变量为字符串 "false" 时）！

JavaScript Number 对象

JavaScript 的 Number 对象是经过封装的能让你处理 数字值 的对象。

JavaScript 的 Number 对象由 Number() 构造器创建。

JavaScript 只有一种数字类型。(不像其他语言有Int,Float,Double...)

可以使用也可以不使用小数点来书写数字。

JavaScript 数字

JavaScript 数字可以使用也可以不使用小数点来书写：

实例

     var pi = 3.14;    // 使用小数点  
    
var x = 67;       // 不使用小数点

极大或极小的数字可通过科学（指数）计数法来写：

实例

     var y = 5.2067e4;    // 52067 
    
var z = 1314e-4;   // 0.1314

所有 JavaScript 数字均为 64 位 (够用!霸气!)

注意: JavaScript 不是类型语言。这是与许多其他编程语言不同的，

JavaScript 没有定义不同类型的数字，比如整数、短、长、浮点等等。

在JavaScript中，数字不分整数类型和浮点型类型，

所有的数字都是由 浮点型 类型。

JavaScript采用IEEE754标准定义的 64位浮点 格式表示数字，

它能表示最大值为±1.7976931348623157 x 10308，

最小值为±5 x 10 -324

值 (aka Fraction/Mantissa)	指数	Sign
52 bits (0 - 51)	11 bits (50 - 62)	1 bit (63)

精度

整数（不使用小数点或指数计数法）最多为 15 位。

小数的最大位数是 17，

但是浮点运算并不总是 100% 准确：

实例

     var x = 0.2+0.1; // result will be 0.30000000000000004 
   

八进制和十六进制

如果前缀为 0，则 JavaScript 会把 数值常量 解释为 八进制数，

如果 前缀为 0 和 "x"，则解释为 十六进制数。

实例

     var y = 0377;  
    
var z = 0xFF;

	绝对不要在数字前面写零，除非您需要进行八进制转换。

默认情况下，JavaScript 数字为 十进制 显示。

但是你可以使用 toString() 方法

输出16进制、8进制、2进制。

实例

     var myNumber=128;  
    
myNumber.toString(16);   // returns 80  
    
myNumber.toString(8);    // returns 200  
    
myNumber.toString(2);    // returns 10000000

无穷大（Infinity）

当数字运算结果超过了JavaScript所能表示的数字上限（溢出）时，

结果为一个特殊的无穷大（infinity）值，在JavaScript中以Infinity表示。

同样地，当负数的值超过了JavaScript所能表示的负数范围，

结果为负无穷大，在JavaScript中以-Infinity表示。

无穷大值的行为特性和我们所期望的是一致的：

基于它们的加、减、乘和除运算结果还是无穷大（当然还保留它们的正负号）。

实例

     myNumber=2;  
    
while (myNumber! = Infinity)  
    
{  
    
myNumber = myNumber*myNumber; // Calculate until Infinity  
    
}

除以0也产生了无限:

实例

     var x = 6/0;  
    
var y = -7/0;

NaN - 非数字值类型是Number,但表示的是一个非数字

NaN 属性是代表 非数字值的特殊值。

该属性用于指示某个值 不是数字。

可以把 Number 对象设置为该值，来指示其不是数字值。

你可以使用 isNaN() 全局函数来判断一个值是否是 NaN 值。

实例

     var x = 1000 / "Apple";  
    
isNaN(x); // returns true  
    
var y = 100 / "1000";  
    
isNaN(y); // returns false

除以0是无穷大，无穷大是一个数字:

实例

     var x = 1000 / 0;  
    
isNaN(x); // returns false

提示：在 JavaScript 中，如果参数无法被转换为数字，则返回 NaN。 (not a number)

数字可以是数字或者对象

第1种, 数字可以私有数据, 以字面量的形式 进行初始化，就像 x = 67;

第2种, JavaScript 数字可以通过new 关键字,以构造函数,进行 对象初始化，

如, var y = new Number(67);

实例

 
    var x = 67;   // 字面量,类型 number 
    
    var y = new Number(67);  // new 构造函数,类型是 Object 
    
    typeof(x) // 返回的字符串是:  
    number 
      
    typeof(y) // 返回的字符串是:  
    object

实例

 
    var x = 67;  // 字面量,类型 number 
    
    var y = new Number(67);  // 类型是对象Object 
    
    (x  
    === 
     y) // is  
    false 
     because x is a number and y is an object.

数字属性

MAX_VALUE
MIN_VALUE
NEGATIVE_INFINITY 负无穷
POSITIVE_INFINITY 正无穷
NaN 不是一个数字
prototype
constructor

数字方法

toExponential()
toFixed()
toPrecision()
toString()
valueOf()

Number 对象属性

属性	描述
constructor	返回对创建此对象的 Number 函数的引用。
MAX_VALUE	可表示的最大的数。
MIN_VALUE	可表示的最小的数。
NEGATIVE_INFINITY	负无穷大，溢出时返回该值。
NaN	非数字值。
POSITIVE_INFINITY	正无穷大，溢出时返回该值。
prototype	允许您有能力向对象动态添加属性和方法。

Number 对象方法

方法	描述
toExponential(x)	把对象的值转换为指数计数法。
toFixed(x)	把数字转换为字符串，结果的小数点后有指定位数的数字。
toPrecision(x)	把数字格式化为指定的长度。
toString()	把数字转换为字符串，使用指定的基数。
valueOf()	返回一个 Number 对象的基本数字值。

JavaScript Math（算数）对象

Math（算数）对象的作用是：执行常见的算数任务。

在线实例

round()
如何使用四舍五入 round()。

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

max()
如何使用 max() 来返回两个给定的数中的较大的数。（在 ECMASCript v3 之前，该方法只有两个参数。）

min()
如何使用 min() 来返回两个给定的数中的较小的数。（在 ECMASCript v3 之前，该方法只有两个参数。）

完整的 Math 对象参考手册

我们提供 JavaScript Math 对象的参考手册，其中包括所有可用于算术对象的属性和方法。

该手册包含了对每个属性和方法的详细描述以及相关实例。

Math 对象属性

属性	描述
E	返回算术常量 e，即自然对数的底数（约等于2.718）。
LN2	返回 2 的自然对数（约等于0.693）。
LN10	返回 10 的自然对数（约等于2.302）。
LOG2E	返回以 2 为底的 e 的对数（约等于 1.414）。
LOG10E	返回以 10 为底的 e 的对数（约等于0.434）。
PI	返回圆周率（约等于3.14159）。
SQRT1_2	返回返回 2 的平方根的倒数（约等于 0.707）。
SQRT2	返回 2 的平方根（约等于 1.414）。

Math 对象方法

方法	描述
abs(x)	返回 x 的绝对值。
acos(x)	返回 x 的反余弦值。
asin(x)	返回 x 的反正弦值。
atan(x)	以介于 -PI/2 与 PI/2 弧度之间的数值来返回 x 的反正切值。
atan2(y,x)	返回从 x 轴到点 (x,y) 的角度（介于 -PI/2 与 PI/2 弧度之间）。
ceil(x)	对数进行向上舍入。
cos(x)	返回数的余弦。
exp(x)	返回 E^x 的指数。
floor(x)	对 x 进行向下舍入。
log(x)	返回数的自然对数（底为e）。
max(x,y,z,...,n)	返回 x,y,z,...,n 中的最高值。
min(x,y,z,...,n)	返回 x,y,z,...,n中的最低值。
pow(x,y)	返回 x 的 y 次幂。
random()	返回 0 ~ 1 之间的随机数。
round(x)	把数四舍五入为最接近的整数。
sin(x)	返回数的正弦。
sqrt(x)	返回数的平方根。
tan(x)	返回角的正切。

Math 对象

Math（算数）对象的作用是：执行普通的算数任务。

Math 对象提供多种算数值类型和函数。

无需在使用这个对象之前对它进行定义。

使用Math的属性/方法的语法：

      var x=Math.PI; 
     
 var y=Math.sqrt(16);

注意： Math对象无需在使用这个对象之前对它进行定义。

提示： Math 对象 不能使用 new 关键字创建对象实例。

直接用 “Math.成员”的格式来访问其属性或者方法。

算数值

JavaScript 提供 8 种可被 Math 对象访问的算数值：

你可以参考如下Javascript常量使用方法：

      Math.E 
     
 Math.PI 
     
 Math.SQRT2 
     
 Math.SQRT1_2 
     
 Math.LN2 
     
 Math.LN10 
     
 Math.LOG2E 
     
 Math.LOG10E

算数方法

除了可被 Math 对象访问的算数值以外，还有几个函数（方法）可以使用。

下面的例子使用了 Math 对象的 round 方法对一个数进行四舍五入。

      document.write(Math.round(5.5)); 
    

上面的代码输出为：

6

下面的例子使用了 Math 对象的 random() 方法来返回一个介于 0 和 1 之间的随机数：

      document.write(Math.random()); 
    

上面的代码输出为：

      0.6752013146666666 
    

下面的例子使用了 Math 对象的 floor() 方法和 random() 来返回一个介于 0 和 10 之间的随机数：

     document.write(Math.floor(Math.random()*10)); 
   

上面的代码输出为：

5

JavaScript Date（日期）对象

日期对象用于处理日期和时间。

在线实例

返回当日的日期和时间
如何使用 Date() 方法获得当日的日期。

getFullYear()
使用 getFullYear() 获取年份。

getTime()
getTime() 返回从 1970 年 1 月 1 日至今的毫秒数。

setFullYear()
如何使用 setFullYear() 设置具体的年份。

toUTCString()
如何使用 toUTCString() 将当日的日期（根据 UTC）转换为字符串。

getDay()
如何使用 getDay() 和数组来显示星期，而不仅仅是数字。

Display a clock
如何在网页上显示一个钟表。

代码如下:

<!DOCTPYE html>  
<html lang="zh">  
<head>  
    <link rel="icon" href="beyond.jpg" type="image/x-icon"/>
    <meta charset="UTF-8">
    <meta name="author" content="beyond">
    <meta http-equiv="refresh" content="520">
    <meta name="description" content="免费零基础教程">
    <meta name="viewport" content="width=device-width, 
    initial-scale=1.0, maximum-scale=1.0,minimum-scale=1.0,user-scalable=0" />
    <meta name="keywords" content="HTML,CSS,JAVASCRIPT">
    <title>beyondの心中の动漫神作</title>
    <link rel="stylesheet" type="text/css" href="beyondbasestylewhite3.css">
    <script type="text/javascript" src="nslog.js"></script>

    <!--[if lt IE 9]>
        <script src="//apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.js"></script>
    <![endif]-->

    <style type="text/css">
        body{
            font-size: 100%; 
            /*声明margin和padding是个好习惯*/  
            margin: 0;  
            padding: 0; 
            background-image: url("sakura4.png");  
            background-repeat: no-repeat;  
            background-position: center center;  
        }
        div {
            background-color: rgba(13,109,108,0.5);
            color: white;
            padding: 20px;
            border:1px solid;
        }

    </style>
    <!-- 绿色按钮的css效果 -->
    <link rel="stylesheet" type="text/css" href="beyondbuttongreen.css">
</head>  
  
<body οnlοad="displayTime()">  
        <h1 style="color:white;text-shadow:2px 2px 4px #000;letter-spacing:5px;" class="sgcontentcolor sgcenter">  
            未闻花名
        </h1>
        
        <p id="id_p_time" class="sgcenter"></p>
         
         <script type="text/javascript">
            function displayTime() {
                var today = new Date();
                var hour = today.getHours();
                var minute = today.getMinutes();
                var second = today.getSeconds();
                // fix 显示修正
                minute = fixFunction(minute);
                second = fixFunction(second);
                // 显示到页面
                var pTimeNode = document.getElementById("id_p_time");
                pTimeNode.innerHTML = hour + ":" + minute + ":" + second;
                // 开启定时器
                var timer = setTimeout(
                        // 要执行的函数
                        function () {
                            displayTime();
                        },500
                    );
            }

            // 修正时间
            function fixFunction (num) {
                if (num < 10) {
                    num = '0' +num;   
                }
                return num;
            }
         </script>
        <p class="sgcontentcolor sgcenter" style="clear:left;">
            <b>注意:</b>电子时钟
        </p>
        <footer id="copyright">
            <p style="font-size:14px;text-align:center;font-style:italic;">  
            Copyright © <a id="author">2018</a> Powered by <a id="author">beyond</a>  
            </p>        
        </footer>
    </div>
</body>  
</html>

效果如下:

完整的 Date 对象参考手册

我们提供 JavaScript Date 对象参考手册，其中包括所有可用于日期对象的属性和方法。JavaScript Date 对象参考手册。

该手册包含了对每个属性和方法的详细描述以及相关实例。

Date 对象属性

属性	描述
constructor	返回对创建此对象的 Date 函数的引用。
prototype	使您有能力向对象添加属性和方法。

Date 对象方法

方法	描述
getDate()	从 Date 对象返回一个月中的某一天 (1 ~ 31)。
getDay()	从 Date 对象返回一周中的某一天 (0 ~ 6)。0代表日耀日
getFullYear()	从 Date 对象以四位数字返回年份。
getHours()	返回 Date 对象的小时 (0 ~ 23)。
getMilliseconds()	返回 Date 对象的毫秒(0 ~ 999)。
getMinutes()	返回 Date 对象的分钟 (0 ~ 59)。
getMonth()	从 Date 对象返回月份 (0 ~ 11)。
getSeconds()	返回 Date 对象的秒数 (0 ~ 59)。
getTime()	返回 1970 年 1 月 1 日至今的毫秒数。
getTimezoneOffset()	返回本地时间与格林威治标准时间 (GMT) 的分钟差。
getUTCDate()	根据世界时从 Date 对象返回月中的一天 (1 ~ 31)。
getUTCDay()	根据世界时从 Date 对象返回周中的一天 (0 ~ 6)。
getUTCFullYear()	根据世界时从 Date 对象返回四位数的年份。
getUTCHours()	根据世界时返回 Date 对象的小时 (0 ~ 23)。
getUTCMilliseconds()	根据世界时返回 Date 对象的毫秒(0 ~ 999)。
getUTCMinutes()	根据世界时返回 Date 对象的分钟 (0 ~ 59)。
getUTCMonth()	根据世界时从 Date 对象返回月份 (0 ~ 11)。
getUTCSeconds()	根据世界时返回 Date 对象的秒钟 (0 ~ 59)。
getYear()	已废弃。请使用 getFullYear() 方法代替。
parse()	返回1970年1月1日午夜到指定日期（字符串）的毫秒数。
setDate()	设置 Date 对象中月的某一天 (1 ~ 31)。
setFullYear()	设置 Date 对象中的年份（四位数字）。
setHours()	设置 Date 对象中的小时 (0 ~ 23)。
setMilliseconds()	设置 Date 对象中的毫秒 (0 ~ 999)。
setMinutes()	设置 Date 对象中的分钟 (0 ~ 59)。
setMonth()	设置 Date 对象中月份 (0 ~ 11)。
setSeconds()	设置 Date 对象中的秒钟 (0 ~ 59)。
setTime()	setTime() 方法以毫秒设置 Date 对象。
setUTCDate()	根据世界时设置 Date 对象中月份的一天 (1 ~ 31)。
setUTCFullYear()	根据世界时设置 Date 对象中的年份（四位数字）。
setUTCHours()	根据世界时设置 Date 对象中的小时 (0 ~ 23)。
setUTCMilliseconds()	根据世界时设置 Date 对象中的毫秒 (0 ~ 999)。
setUTCMinutes()	根据世界时设置 Date 对象中的分钟 (0 ~ 59)。
setUTCMonth()	根据世界时设置 Date 对象中的月份 (0 ~ 11)。
setUTCSeconds()	setUTCSeconds() 方法用于根据世界时 (UTC) 设置指定时间的秒字段。
setYear()	已废弃。请使用 setFullYear() 方法代替。
toDateString()	把 Date 对象的日期部分转换为字符串。
toGMTString()	已废弃。请使用 toUTCString() 方法代替。
toISOString()	使用 ISO 标准返回字符串的日期格式。
toJSON()	以 JSON 数据格式返回日期字符串。
toLocaleDateString()	根据本地时间格式，把 Date 对象的日期部分转换为字符串。
toLocaleTimeString()	根据本地时间格式，把 Date 对象的时间部分转换为字符串。
toLocaleString()	据本地时间格式，把 Date 对象转换为字符串。
toString()	把 Date 对象转换为字符串。
toTimeString()	把 Date 对象的时间部分转换为字符串。
toUTCString()	根据世界时，把 Date 对象转换为字符串。
UTC()	根据世界时返回 1970 年 1 月 1 日到指定日期的毫秒数。
valueOf()	返回 Date 对象的原始值。

创建日期

Date 对象用于处理日期和时间。

可以通过 new 关键词来定义 Date 对象。

以下代码定义了名为 myDate 的 Date 对象：

有四种方式初始化日期:

     new Date() // 当前日期和时间 
    
new Date(milliseconds) //返回从 1970 年 1 月 1 日至今的毫秒数 
    
new Date(dateString) 
    
new Date(year, month, day, hours, minutes, seconds, milliseconds)

上面的参数大多数都是可选的，在不指定的情况下，默认参数是0。

从 1970 年 1 月 1 日通用一天计算为86,400,000毫秒

实例化一个日期的一些例子：注意:月份是 0 - 11

     var today = new Date() 
    
var d1 = new Date("June 7, 2006 05:20:00") 
    
var d2 = new Date(2006,5,7) // 2006年6月7日 
    
var d3 = new Date(2006,5,7,5,20,0) 
    // 2006年6月7日05点20分0秒

设置日期

通过使用针对日期对象的方法，我们可以很容易地对日期进行操作。

在下面的例子中，我们为日期对象设置了一个特定的日期 (2010 年 6 月 7 日)：

注意: 月份是 0 ~ 11

     var myDate=new Date(); 
    
myDate.setFullYear(2010,5,7);

在下面的例子中，我们将日期对象设置为 1 天前的日期：

     var myDate=new Date(); 
    
myDate.setDate(myDate.getDate() - 1);

注意: 如果增加天数,依然会 改变月份或者年份，因为日期对象会自动完成这种转换。

两个日期比较

日期对象也可用于比较两个日期。

下面的代码将当前日期与 2100 年 1 月 14 日做了比较：

     var x=new Date(); 
    
x.setFullYear(2006,5,7); // 2006年6月7号 
    
var today = new Date(); 
    
if (x>today) 
    
  { 
    
  alert("Today is before 14th January 2100"); 
    
  } 
    
else 
    
  { 
    
  alert("Today is after 14th January 2100"); 
    
  }

JavaScript Array（数组）对象

数组对象的作用是：使用单独的 变量名 来存储一系列的值。

在线实例

创建数组, 为其赋值：

实例

   var girlArr = new Array(); 
  
girlArr[0] = "面码"; 
  
girlArr[1] = "逢坂大河"; 
  
girlArr[2] = "艾拉";

页面底部你可以找到更多的实例。

提示：在JavaScript数组中，第一个数组元素的索引值为 0，第二个索引值为 1，依次类推。

什么是数组?

数组对象是使用单独的变量名来存储一系列的值。

如果你有一组数据（例如：二次元女神），存在单独变量如下所示：

   var girlName_1 = " 
  面码"; 
  
 var 
  girlName_2 = " 
  Saber"; 
  
 var 
  girlName_3 = "娜可露露"; 
 

然而，如果你想从中找出某一位女神？

并且,你的后宫人数总数目不只是3位，而是300位,3000位,甚至30000位呢？

这可不是一件容易的事！

最好的方法就是用数组。

数组可以用一个 变量名 存储所有的值，并且可以用 变量名 访问任何一个值。

数组中的每个元素都有自己的的ID (下标也称索引)，以便它可以很容易地被访问到。

创建一个数组

创建一个数组，JS总共有3种方法。

下面的代码定义了一个名为 girlArr的数组对象：

1: 常规方式,通过new 加构造函数,然后一一添加成员

   var girlArr = new Array(); 
  
  girlArr[0] = "面码";       
  
  girlArr[1] = " 
  Sabar"; 
  
  girlArr[2] = "mathilda";

2: 简洁方式,通过new 加构造函数,并且同时通过参数传递成员

   var 
  girlArr = new Array("面码","Sabar","mathilda"); 
 

3: 字面量:

   var 
  girlArr = ["面码","Sabar","mathilda"]; 
 

访问数组

通过指定数组名加索引号，你可以访问某个特定的元素。

以下实例可以访问girlArr数组的第一个值：

   var girl = girlArr[0]; 
 

以下实例修改了数组 girlArr 的第一个元素:

   girlArr[0]="椎名真白"; 
 

	[0] 是数组的第一个元素。[1] 是数组的第二个元素。

注意: 在JS中,一个数组里,你可以存放不同的对象

所有的JavaScript变量都是对象。

数组元素是对象。

函数是对象。

因此，你可以在数组中有 不同的变量类型。

你可以在一个数组中包含对象元素、函数、数组：

   arr[0] = Date.now; 
  
 arr[1] = myFunction; 
  
 arr[2] = girlArray;

数组方法和属性

使用数组对象预定义的属性和方法：

   var len = girlArr.length             // the number of elements in girlArr 
  
 var positionOfMenma = girlArr.indexOf("面码")   // the index position of "面码"

完整的数组对象参考手册

你可以参考本站关于数组的所有属性和方法的完整参考手册。

参考手册包含了所有属性和方法的描述（和更多的例子）。

完整数组对象参考手册

创建新方法

原型prototype 是JavaScript 全局构造函数。

它可以构建新Javascript对象的属性和方法。

实例：创建一个新的方法。

   Array.prototype.ucase=function() 
  
{ 
  
  for (i=0;i<this.length;i++) 
  
  {this[i]=this[i].toUpperCase();} 
  
}

上面的例子创建了新的数组方法用于将数组小写字符转为大写字符。

Array 对象方法

方法	描述
concat()	连接两个或更多的数组，并返回结果。
every(isAdult)	检测数组元素的每个元素是否都符合条件。参数是一个函数名
filter(isLoli)	检测数组元素，并返回符合条件所有元素的数组。参数是一个函数名
indexOf()	搜索数组中的元素，并返回它所在的位置。
join(separator)	把数组的所有元素放入一个字符串。参数是可选的separator
lastIndexOf()	返回一个指定的字符串值最后出现的位置，在一个字符串中的指定位置从后向前搜索。
map()	通过指定函数处理数组的每个元素，并返回处理后的数组。参数是一个函数名,每个元素都会执行一次该函数,参数2可选index,参数3是原数组
pop()	删除数组的最后一个元素并返回删除的元素。
push()	向数组的末尾添加一个或更多元素，并返回新的长度。
reverse()	反转数组的元素顺序。
shift()	删除并返回数组的第一个元素。
slice()	选取数组的的一部分，并返回一个新数组。
some()	检测数组元素中是否有(只要有1个都算)元素符合指定条件。参数是个函数名
sort()	对数组的元素进行排序。
splice()	从数组中添加或删除元素。参数1是索引,参数2是欲删个数,参数3非必须,是欲插入元素们
toString()	把数组转换为字符串，并返回结果。
unshift()	向数组的开头添加一个或更多元素，并返回新的长度。
valueOf()	返回数组对象的原始值。???Excuse Me???

every()函数,检测是否全部者是loli

filter函数,过滤出所有的loli:

map函数,将数组内每一个元素都执行一次xxoo函数

定义和用法

slice() 方法可从已有的数组中返回选定的元素。

slice()方法可提取字符串的某个部分，并以新的字符串返回被提取的部分。

注意： slice() 方法不会改变原始数组。

语法

 
  array.slice( 
  start, 
  end) 前闭后开 
 

参数 Values

参数	描述
start	必需。规定从何处开始选取。如果是负数，那么它规定从数组尾部开始算起的位置也就是说，-1 指最后一个元素，-2 指倒数第二个元素，以此类推。
end	可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数，那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数，那么它规定的是从数组尾部开始算起的元素。

参数

描述

start

必需。规定从何处开始选取。如果是负数，那么它规定从数组尾部开始算起的位置

也就是说，-1 指最后一个元素，-2 指倒数第二个元素，以此类推。

end

可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数，那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数，那么它规定的是从数组尾部开始算起的元素。

返回值

Type	描述
Array	返回一个新的数组，包含从 start 到 end （不包括该end元素）的 arrayObject 中的元素。前闭后开

JavaScript 数组知识图

JavaScript 字符串（String）对象

String 对象用于处理已有的字符块。

JavaScript 字符串

一个字符串用于存储一系列字符就像 "未闻花名".

一个字符串可以使用 单引号或双引号：

实例

   var girlName = "面码";  
  
var animeName = '未闻花名';

你使用位置（索引）可以访问字符串中任何的字符：

实例

   var character = animeName[2]; // 花 
 

字符串的索引从零开始, 所以字符串第一字符为 [0],第二个字符为 [1], 等等。

你可以在字符串中使用引号,只要内外引用不相同即可，

如下实例：

实例

   var str = "面码's age is 13";  
  
var str = "面码 is 'A' cup";  
  
var str = '面码是动漫"未闻花名"的女主';

如果内外引用相同,你也可以在字符串中使用 转义字符（\）将引号转义即可：

实例

   var str = '面码\'s age is 13';  
  
var answer="面码 is \"A\" cup";

字符串（String）

字符串（String）使用长度属性length来计算字符串的长度：

实例

   var txt="Hello Beyond!";  
  
document.write(txt.length);  
  
var txt="ABCDEFGHIJKLMNOPQRSTUVWXYZ";  
  
document.write(txt.length);

JavaScript 获取字符串的长度：

通过在字符串变量或字符串后面写上 .length 来获得变量中string （字符串）值的长度

注意: console.log("未闻花名".length); // 结果是4

在字符串中查找字符串

字符串使用 indexOf() 来定位字符串中某一个指定的字符首次出现的位置：

实例

   var str = "Hello Beyond, I love 二次元~";  
  
var position = str.indexOf("beyond");

如果没找到对应的字符函数返回-1

lastIndexOf() 方法在字符串末尾开始查找字符串出现的位置。

内容匹配 match函数,若找到,将返回该字符串;否则,返回 null

match()函数用来查找字符串中特定的字符，

并且如果找到的话，则返回一个object,这个object结构如下:

实例

   var str = "hello beyond!";  
  
document.write(str.match(" 
  beyond") + "<br>");  
  
document.write(str.match(" 
  Beyond"));

替换内容

replace() 方法在字符串中用某些字符替换另一些字符。

实例

   var str = "hello world!"  
  
var slogan = str.replace("world!","beyond~");

字符串大小写转换源字符串不变

字符串大小写转换使用函数 toUpperCase() / toLowerCase():

实例

   var txt = "Hello Beyond!";       // String  
  
var txt1 = txt.toUpperCase();   // txt1 is txt converted to upper  
  
var txt2 = txt.toLowerCase();   // txt2 is txt converted to lower

字符串转为数组

字符串使用string>split()函数转为数组:

实例

   txt="a,b,c,d,e"   // String  
  
txt.split(",");   // Split on commas  
  
txt.split(" ");   // Split on spaces  
  
txt.split("|");   // Split on pipe

特殊字符

Javascript 中可以使用 反斜线（\）转义并插入特殊符号，

如：撇号,引号等其他特殊符号。

查看如下 JavaScript 代码:

   var txt="面码是"未闻花名"的女主"; 
  
document.write(txt);

在JavaScript中，字符串的开始和停止使用单引号或双引号。

这意味着，上面的字符串将被切成：面码是

解决以上的问题可以使用反斜线来转义引号：

   var txt = "面码是\"未闻花名\"的女主"; 
  
document.write(txt);

JavaScript将输出正确的文本字符串：面码是"未闻花名"的主角

下表列出其他特殊字符，可以使用反斜线转义特殊字符：

代码	输出
\'	单引号
\"	双引号
\\	斜杆
\n	换行
\r	回车
\t	tab
\b	空格
\f	换页

字符串属性和方法

属性:

length
prototype
constructor

方法:

charAt()
charCodeAt()
concat()
fromCharCode()
indexOf()
lastIndexOf()
match()
replace()
search()
slice()
split()
substr()
substring()
toLowerCase()
toUpperCase()
valueOf()

JavaScript 和 HTML DOM 参考手册：JavaScript String 对象

String 对象属性

属性	描述
constructor	对创建该对象的函数的引用
length	字符串的长度
prototype	允许您向对象添加属性和方法

String 对象方法

方法	描述
charAt()	返回在指定位置的字符。
charCodeAt()	返回在指定的位置的字符的 Unicode 编码。
concat()	连接两个或更多字符串，并返回新的字符串。
fromCharCode()	将1个或多个 Unicode 编码转为字符。
indexOf()	返回某个指定的字符串值在字符串中首次出现的位置。
lastIndexOf()	从后向前搜索字符串。
match()	查找找到一个或多个正则表达式的匹配。
replace()	在字符串中查找匹配的子串，并替换与正则表达式匹配的子串。
search()	查找与正则表达式相匹配的值。返回:查找到的起始位置position
slice()	提取字符串的片断，并在新的字符串中返回被提取的部分。[start,end)前闭后开,若是负,则从后往前数
split(separator, limit)	把字符串分割为字符串数组。空字符串作参数1时,一一拆开; 参数2表示,取前面几个; 不改变原字符串
substr()	从起始索引号提取字符串中指定数目的字符。
substring()	提取字符串中两个指定的索引号之间的字符。
toLowerCase()	把字符串转换为小写。
toUpperCase()	把字符串转换为大写。
trim()	去除字符串两边的空白
valueOf()	返回某个字符串对象的原始值。

substr()方法的定义和用法

substr() 方法可在字符串中抽取从开始下标开始的 指定数目 的字符。

提示： substr() 的参数指定的是子串的开始位置和长度，因此它可以替代 substring() 和 slice() 来使用。
ECMAscript 没有对该方法进行标准化，因此反对使用它。

注意： substr() 方法不会改变源字符串。

语法

 
   string.substr( 
   start, 
   length) 
  

参数值

参数	描述
start	必需。要抽取的子串的起始下标。必须是数值。如果是负数，那么该参数声明从字符串的尾部开始算起的位置。也就是说，-1 指字符串中最后一个字符，-2 指倒数第二个字符，以此类推。
length	可选。子串中的字符数。必须是数值。如果省略了该参数，那么返回从 stringObject 的开始位置到结尾的所有字串。

substring()方法的定义和用法

substring() 方法用于提取字符串中介于两个指定下标之间的字符。

substring() 方法返回的子串包括开始处的字符，但不包括结束处的字符。前闭后开

语法

 
   string.substring(from, to) 
  

参数	描述
from	必需。一个非负的整数，规定要提取的子串的第一个字符在 string Object 中的位置。
to	可选。一个非负的整数，比要提取的子串的最后一个字符在 string Object 中的位置多 1。如果省略该参数，那么返回的子串会一直到字符串的结尾。

String HTML 包装方法

HTML 包装方法返回加入了适当HTML标签的字符串。

方法	描述
anchor()	创建 HTML 锚。
big()	用大号字体显示字符串。
blink()	显示闪动字符串。
bold()	使用粗体显示字符串。
fixed()	以打字机文本显示字符串。
fontcolor()	使用指定的颜色来显示字符串。
fontsize()	使用指定的尺寸来显示字符串。
italics()	使用斜体显示字符串。
link()	将字符串显示为链接。
small()	使用小字号来显示字符串。
strike()	使用小字号来显示字符串。
sub()	把字符串显示为下标。
sup()	把字符串显示为上标。

JavaScript 字符串函数学习脑图

JavaScript RegExp 对象

RegExp：是正则表达式（regular expression）的简写。

RegExp 对象用于规定在文本中检索的内容。

什么是 RegExp？

正则表达式描述了字符的模式对象。

当您检索某个文本时，可以使用一种模式来描述要检索的内容。RegExp 就是这种模式。

简单的模式可以是一个单独的字符。

更复杂的模式包括了更多的字符，并可用于解析、格式检查、替换等等。

您可以规定字符串中的检索位置，以及要检索的字符类型，等等。

语法

     var patt=new RegExp(pattern,modifiers); 
    
or more simply: 
    
var patt=/pattern/modifiers;

模式描述了一个表达式模型。
修饰符描述了检索是否是全局g，区分大小写i等。

RegExp 修饰符

修饰符用于执行 不区分大小写 和全文的搜索。

i - 修饰符是用来执行不区分大小写的匹配。

g - 修饰符是用于执行全文的搜索（而不是在找到第一个就停止查找,而是找到所有的匹配）。

实例 1

在字符串中不区分大小写找"Beyond"

     var str = "hello Beyond";  
    
var patt1 = /beyond/i;

以下标记的文本是获得的匹配的表达式：

 
    Beyond 
   

实例 2

全文查找 "is"

     var str="我们仍未知道那年夏天所见到的花的名字";  
    
var patt1=/的/g;

以下标记的文本是获得的匹配的表达式：

实例 3

全文查找和不区分大小写搜索 "is"

     var str = "HELLO Beyond";  
    
var patt1 = /e/gi;

以下标记的文本是获得的匹配的表达式：

test()

The test()方法搜索字符串指定的值，根据结果并返回真或假。

下面的示例是从字符串中搜索字符 "e" ：

实例

     var patt1 = new RegExp("o");  
    
document.write(patt1.test("anohana"));

由于该字符串中存在字母 "e"，以上代码的输出将是：

     true 
   

exec()

exec() 方法检索字符串中的指定值。

返回值是被找到的值。

如果没有发现匹配，则返回 null。

下面的示例是从字符串中搜索字符 "e" ：

实例 1

     var patt1=new RegExp("e");  
    
document.write(patt1.exec("The best things in life are free"));

由于该字符串中存在字母 "e"，以上代码的输出将是：

 
    e   // 
    无聊,晕

JavaScript RegExp 对象

RegExp 对象

正则表达式是描述字符模式的对象。

正则表达式用于对字符串模式匹配及检索替换，是对字符串执行模式匹配的强大工具。

语法

       var patt=new RegExp(pattern,modifiers); 
      
或者更简单的方式: 
      
var patt=/pattern/modifiers;

pattern（模式）描述了表达式的模式
modifiers(修饰符) 用于指定全局匹配、区分大小写的匹配和多行匹配

注意：当使用构造函数+ new关键字,来创造正则对象时，

需要常规的字符转义规则（在前面加反斜杠 \）。

比如，以下是等价的：
var re = new RegExp("\\w+");    // 对 \w中的\进行转义
var re = /\w+/;

修饰符

修饰符用于执行区分大小写和全局匹配:

修饰符	描述
i	执行对大小写不敏感的匹配。
g	执行全局匹配（查找所有匹配而非在找到第一个匹配后停止）。
m	执行多行匹配。

方括号

方括号用于查找某个范围内的字符：

表达式	描述
[abc]	查找方括号之间的任何字符。
[^abc]	查找任何不在方括号之间的字符。
[0-9]	查找任何从 0 至 9 的数字。
[a-z]	查找任何从小写 a 到小写 z 的字符。
[A-Z]	查找任何从大写 A 到大写 Z 的字符。
[A-z]	查找任何从大写 A 到小写 z 的字符。
[adgk]	查找给定集合内的任何字符。
[^adgk]	查找给定集合外的任何字符。
(red\|blue\|green)	查找任何指定的选项。???Excuse Me???

元字符

元字符（Metacharacter）是拥有特殊含义的字符：

元字符	描述
.	查找单个字符，除了换行和行结束符。
\w	查找单词字符。
\W	查找非单词字符。
\d	查找数字。
\D	查找非数字字符。
\s	查找空白字符。space
\S	查找非空白字符。
\b	匹配单词边界。 boundary
\B	匹配非单词边界。
\0	查找 NUL 字符。
\n	查找换行符。
\f	查找换页符。
\r	查找回车符。
\t	查找制表符。
\v	查找垂直制表符。
\xxx	查找以八进制数 xxx 规定的字符。
\xdd	查找以十六进制数 dd 规定的字符。
\uxxxx	查找以十六进制数 xxxx 规定的 Unicode 字符。

量词

量词	描述
n+	匹配任何包含至少一个 n 的字符串。
n*	匹配任何包含零个或多个 n 的字符串。
n?	匹配任何包含零个或一个 n 的字符串。
n{X}	匹配包含 X 个 n 的序列的字符串。
n{X,Y}	匹配包含 X 至 Y 个 n 的序列的字符串。
n{X,}	匹配包含至少 X 个 n 的序列的字符串。
n$	匹配任何结尾为 n 的字符串。
^n	匹配任何开头为 n 的字符串。
?=n	匹配任何其后紧接指定字符串 n 的字符串。
?!n	匹配任何其后没有紧接指定字符串 n 的字符串。

RegExp 对象方法

方法	描述	FF	IE
compile	编译正则表达式。	1	4
exec	检索字符串中指定的值。返回找到的值，并确定其位置。	1	4
test	检索字符串中指定的值。返回 true 或 false。	1	4

支持正则表达式的 String 对象的方法

方法	描述	FF	IE
search	检索与正则表达式相匹配的值。	1	4
match	找到一个或多个正则表达式的匹配。	1	4
replace	替换与正则表达式匹配的子串。	1	4
split	把字符串分割为字符串数组。	1	4

compile()方法定义和用法 ???Excuse Me???干嘛用的

compile() 方法用于在脚本执行过程中编译正则表达式。

compile() 方法也可用于改变和重新编译正则表达式。

语法

   RegExpObject.compile(regexp,modifier) 
 

参数	描述
regexp	正则表达式。
modifier	规定匹配的类型。"g" 用于全局匹配，"i" 用于区分大小写，"gi" 用于全局区分大小写的匹配。

JavaScript Window 对象

Window 对象表示浏览器中 打开的窗口。

Window 对象描述

Window 对象表示一个浏览器窗口或一个框架frame。

在客户端 JavaScript 中，

Window 对象是 全局对象，所有的表达式都在当前的环境中计算。

Window 子对象

Window的子对象主要有如下几个：

JavaScript document 对象
JavaScript frames 对象
JavaScript history 对象
JavaScript location 对象
JavaScript navigator 对象
JavaScript screen 对象

JavaScript Window对象学习脑图(见Window对象章节JS_07_window)

未完待续,下一章节,つづく

pre_eminent

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS_06_数组_字符串_正则_常见对象

JavaScript 对象JavaScript 中的所有事物都是对象：字符串、(数值)、数组、函数...此外，JavaScript 允许自定义对象。所有事物都是对象JavaScript 提供多个内建对象，比如 String、Date、Array 等等。对象只是带有属性和方法的特殊数据类型。布尔型可以是一个对象。数字型可以是一个对象。字符串也可以是一个对象日期是一个对象数学和...
复制链接

扫一扫