2022年11月21日13:32:00——T5——JS对象与Date日期函数

简介: 2022年11月21日13:32:00——T5——JS对象与Date日期函数

1、JavaScrip对象的使用:

       /**

        * 1、对象的声明赋值使用的是{}花括号,大括号

        * 2、对象中的值以key:value的格式进行赋值,多个值中间使用【,】区分

        * 3、获取对象中的值的方法需要通过[]并给与key名的方式获取:item["name"]

        * /

<script>
        var item = {
            id: 9527,
            name: "王语嫣",
            age: 16,
            introduce: "燕子坞·王夫人的姑娘·段誉的媳妇,琅嬛福地的神仙姐姐。"
        };
        // 输出的是item
        document.write("编号:" + item["id"] + "<br/>");
        document.write("昵称:" + item["name"] + "<br/>");
        document.write("年龄:" + item["age"] + "<br/>");
        document.write("简介:" + item["introduce"] + "<br/>");
        //整个对象
        document.write(item);
        //控制台查看
        console.log(item);
        //Object-对象的总结
        /*
         * 1、对象的声明赋值使用的是{}花括号,大括号
         * 2、对象中的值以key:value的格式进行赋值,多个值中间使用【,】区分
         * 3、获取对象中的值的方法需要通过[]并给与key名的方式获取:item["name"]
         */
    </script>

数组遍历:

<script>
        var item = [{
            id: 9527,
            name: "王语嫣",
            age: 16,
            introduce: "燕子坞·王夫人的姑娘·段誉的媳妇,琅嬛福地的神仙姐姐。"
        }, {
            id: 89757,
            name: "JJ林俊杰",
            age: 20,
            introduce: "林俊杰·唱的《美人鱼》。"
        }];
        // 遍历输出的是item
        for (let i = 0; i < 2; i++) {
            document.write("编号:" + item[i]["id"] + "<br/>");
            document.write("昵称:" + item[i]["name"] + "<br/>");
            document.write("年龄:" + item[i]["age"] + "<br/>");
            document.write("简介:" + item[i]["introduce"] + "<br/>");
        }
    </script>

2、date日期对象

主要需要记忆的是各种Date的获取函数,是函数,所以使用的时候需要添加()。

其中:dateObject 所指的月份中的某一天,使用本地时间。返回值是 1 ~ 31 之间的一个整数。

这里看好,getDate() 是获取当前的日期,每个月的,例如,如果是2月份就只有28或29天了。根据闰年自动出的。

<!-- Data != Date -->
    <!-- 数据  != 日期 -->
    <script>
        var time = new Date();
        document.write(time);
        // 控制台输出time——Date类型
        console.log(time);
        //输出Date对象包含的内容
        document.write("<hr color='red'/>");
        document.write("年:" + time.getFullYear());
        document.write("月:" + time.getMonth());
        document.write("日:" + time.getDate());
        document.write("时:" + time.getHours());
        document.write("分:" + time.getMinutes());
        document.write("秒:" + time.getSeconds());
        document.write("<hr/>");
        //时间拼接:
        document.write(time.getFullYear() + "-" +
            time.getMonth() + "-" +
            time.getDate() + " " +
            time.getHours() + ":" +
            time.getMinutes() + ":" +
            time.getSeconds()
        )
    </script>
  1. milliseconds 参数是一个 Unix 时间戳(Unix Time Stamp),它是一个整数值,表示自 1970 年 1 月 1 日 00:00:00 UTC(the Unix epoch)以来的毫秒数。
  2. dateString 参数表示日期的字符串值。
  3. year, month, day, hours, minutes, seconds, milliseconds 分别表示年、月、日、时、分、秒、毫秒。

3、Image图片对象

// Image图片标签在切换图片的时候使用的是src属性,

//图片路径规则可以为相对路径也可以为绝对路径

<!-- Image对象 -->
    <script>
        var isf = 0;
        function ChangeSrc() {
            if (isf == 0) {
                document.getElementById("imgs").src = "imgs//2.png";
                isf = 1;
            } else {
                document.getElementById("imgs").src = "imgs//1.png";
                isf = 0;
            }
            // Image图片标签在切换图片的时候使用的是src属性,
            //图片路径规则可以为相对路径也可以为绝对路径
        }
    </script>
    <p><img src="imgs//1.png" title="更换图片标签" id="imgs" width="1000px" /></p>
    <p>
        <button onclick="ChangeSrc()" style="width: 50%;height: 30vh;">切换</button>
    </p>

4、数学函数Math

<script>
        document.write(Math.abs(-10));
        document.write("<br/>");
        document.write(Math.ceil(3.14));
        document.write("<br/>");
        document.write(Math.floor(3.94));
        document.write("<br/>");
        document.write(Math.pow(2, 10));
        document.write("<br/>");
        document.write(Math.max(2, 10));
        document.write("<br/>");
        document.write(Math.min(2, 10));
        document.write("<br/>");
        document.write(Math.ceil(Math.random() * 10));
        document.write("<br/>");
        document.write(Math.round(50.534));
        document.write("<br/>");
        document.write(Math.sqrt(3));
        document.write("<br/>");
    </script>

JS数组

  • 每个数组变量都有一个length属性,表示该数组中元素的个数。
  • 定义一个数组变量后,就可以使用“数组变量名[索引号]”的格式来访问每个数组元素。
  • 数组列表中的第一个元素的索引号为0,其后的每个元素的索引号依次递增,最后的元素索引为数组的长度-1。
  • 如果数组元素本身是一个数组,那么这个元素称为子数组,可以使用“数组变量名[子数组索引号][子数组中的元素索引号]”的格式来访问子数组中的元素。
<body>
     <script type="text/javascript">
  var arr=[' 白色',' 紫色',' 橙色',' 红色'];
  for(var i=0; i<arr.length;i++) {
       document.write(arr[i]+"<br/>");
  }
     </script>
</body>

在上面可以看到数组的创建方法,但是很多时候我们可以直接声明。

var arr=new Array()      //数组初始元素个数为0

var arr=new Array(4); //创建具有指定大小的Array 对象

var arr=new Array(1,2,3); //用指定的元素列表去初始化Array 对象,数组的长度是设置的元素的数目

加强for循环【for i in array:】

加强for循环由于没有下标控制需要通过PC计数器进行寻址。

<script type="text/javascript">
    var arr = ["王语嫣", " 小龙女", " 赵灵儿", " 关关雎鸠"]
    for (var i in arr) {
        document.write(arr[i] + "<br/>");
    }
</script>

 

相关文章
|
12天前
|
JavaScript 前端开发
Math对象:JavaScript中的数学工具
Math对象:JavaScript中的数学工具
26 1
N..
|
19天前
|
存储 JavaScript 前端开发
JavaScript中的对象
JavaScript中的对象
N..
10 0
|
1月前
|
JavaScript 前端开发
JavaScript对象系列(菜菜出品,必看!!!)
JavaScript对象系列(菜菜出品,必看!!!)
|
2月前
|
JavaScript 前端开发
JS将两个数组和合并成数组包对象格式的方法
JS将两个数组和合并成数组包对象格式的方法
25 0
|
5天前
|
JavaScript 算法
原生JS完成“一对一、一对多”矩形DIV碰撞检测、碰撞检查,通过计算接触面积(重叠覆盖面积)大小来判断接触对象DOM
原生JS完成“一对一、一对多”矩形DIV碰撞检测、碰撞检查,通过计算接触面积(重叠覆盖面积)大小来判断接触对象DOM
|
2月前
|
JavaScript 前端开发
js遍历对象的方法
js遍历对象的方法
37 1
|
1月前
|
存储 JavaScript 前端开发
在JavaScript中,对象和数组是如何进行扩展的?
在JavaScript中,对象和数组是如何进行扩展的?
20 4
|
2天前
|
JavaScript
js 字符串String转对象Object
该代码示例展示了如何将一个以逗号分隔的字符串(`&#39;1.2,2,3,4,5&#39;`)转换为对象数组。通过使用`split(&#39;,&#39;)`分割字符串并`map(parseFloat)`处理每个元素,将字符串转换成浮点数数组,最终得到一个对象数组,其类型为`object`。
|
2天前
|
JavaScript
JS 获取对象数据类型的键值对的键与值
JS 获取对象数据类型的键值对的键与值
|
10天前
|
存储 JavaScript 前端开发
在浏览器中存储数组和对象(js的问题)
在浏览器中存储数组和对象(js的问题)