JavaScript基础第06天【笔记+代码】

最新推荐文章于 2022-11-17 23:33:52 发布
最新推荐文章于 2022-11-17 23:33:52 发布
阅读量832 收藏 7
点赞数
分类专栏： JavaScript（黑马） 文章标签： javascript
本文链接：https://blog.csdn.net/weixin_41700993/article/details/106454967
版权

内置对象、简单类型与复杂类型

昨日复习

  • 函数中使用 arguments可以不使用形参得到实参
  • 全局作用域中声明的变量称为 全局变量
  • 函数的两种创建方式是 函数表达式 与 function关键词件
  • 作用域中的代码在执行之前浏览器会把 变量声明 和 函数声明 提前执行
  • 构造函数的功能是 创建对象
  • 构造函数中this指向 函数内部创建的对象
  • 构造函数调用时必须是被关键词 new 调用

1. 内置对象

  • JavaScript 中的对象分为3种：自定义对象 、内置对象、 浏览器对象
  • 前面两种对象是JS 基础 内容，属于 ECMAScript； 第三个浏览器对象属于我们JS 独有的， 我们JS API 讲解
  • 内置对象 就是指 JS 语言自带的一些对象，这些对象供开发者使用，并提供了一些常用的或是最基本而必要的功能（属性和方法）
  • 内置对象最大的优点就是帮助我们快速开发
  • JavaScript 提供了多个内置对象：Math、 Date 、Array、String等

2. 查文档

2.1 MDN

学习一个内置对象的使用，只要学会其常用成员的使用即可，我们可以通过查文档学习，可以通过MDN/W3C来查询。

Mozilla 开发者网络（MDN）提供了有关开放网络技术（Open Web）的信息，包括 HTML、CSS 和万维网及HTML5 应用的 API。

MDN: https://developer.mozilla.org/zh-CN/

2.2 如何学习对象中的方法

  1. 查阅该方法的功能
  2. 查看里面参数的意义和类型
  3. 查看返回值的意义和类型
  4. 通过 demo 进行测试

3. Math对象

3.1 Math概述

Math 对象不是构造函数，它具有数学常数和函数的属性和方法。跟数学相关的运算（求绝对值，取整、最大值等）可以使用 Math 中的成员。

Math.PI // 圆周率
Math.floor() // 向下取整
Math.ceil() // 向上取整
Math.round() // 四舍五入版 就近取整 注意 -3.5 结果是 -3 
Math.abs() // 绝对值
Math.max()/Math.min() // 求最大和最小值

注意：上面的 方法必须带括号

01 - Math对象最大值

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>01 - Math对象最大值</title>
    <script>
        // Math数学对象 不是一个构造函数 ，所以我们不需要new 来调用 而是直接使用里面的属性和方法即可
        console.log(Math.PI); // 一个属性 圆周率 3.141592653589793
        console.log(Math.max(1, 99, 3)); // 99
        console.log(Math.max(-1, -10)); // -1
        console.log(Math.max(1, 99, 'bing')); // NaN
        console.log(Math.max()); // -Infinity
    </script>
</head>
<body>

</body>
</html>

02 - 封装自己的数学对象

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>02 - 封装自己的数学对象</title>
    <script>
        // 利用对象封装自己的数学对象  里面有 PI 最大值和最小值
        var myMath = {
    
            PI: 3.141592653,
            max: function() {
    
                var max = arguments[0];
                for (var i = 1; i < arguments.length; i++) {
    
                    if (arguments[i] > max) {
    
                        max = arguments[i];
                    }
                }
                return max;
            },
            min: function() {
    
                var min = arguments[0];
                for (var i = 1; i < arguments.length; i++) {
    
                    if (arguments[i] < min) {
    
                        min = arguments[i];
                    }
                }
                return min;
            }
        }
        console.log(myMath.PI); // 3.141592653
        console.log(myMath.max(1, 5, 9)); // 9
        console.log(myMath.min(1, 5, 9)); // 1
    </script>
</head>
<body>

</body>
</html>

03 - Math绝对值和三个取整方法

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>03 - Math绝对值和三个取整方法</title>
    <script>
        // 1. 绝对值方法
        console.log(Math.abs(1)); // 1
        console.log(Math.abs(-1)); // 1
        console.log(Math.abs('-1')); // 1 隐式转换 会把字符串型 -1 转换为数字型
        console.log(Math.abs('bing')); // NaN 

        // 2. 三个取整方法
        // (1) Math.floor()   地板 向下取整  往最小了取值
        console.log(Math.floor(1.1)); // 1
        console.log(Math.floor(1.9)); // 1
        // (2) Math.ceil()   ceil 天花板 向上取整  往最大了取值
        console.log(Math.ceil(1.1)); // 2
        console.log(Math.ceil(1.9)); // 2
        // (3) Math.round()   四舍五入  其他数字都是四舍五入，但是 .5 特殊 它往大了取  
        console.log(Math.round(1.1)); // 1
        console.log(Math.round(1.5)); // 2
        console.log(Math.round(1.9)); // 2
        console.log(Math.round(-1.1)); // -1
        console.log(Math.round(-1.5)); // 这个结果是 -1
    </script>
</head>
<body>

</body>
</html>

04 - Math对象随机数方法

3.2 随机数方法 random()

random() 方法可以随机返回一个小数，其取值范围是 [0，1)，左闭右开 0 <= x < 1

得到一个两数之间的随机整数，包括两个数在内

function getRandom(min, max) {
   
	return Math.floor(Math.random() * (max - min + 1)) + min; 
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>04 - Math对象随机数方法</title>
    <script>
        // 1.Math对象随机数方法   random() 返回一个随机的小数  0 =< x < 1
        // 2. 这个方法里面不跟参数
        // 3. 代码验证 
        console.log(Math.random()); 
        // 4. 我们想要得到两个数之间的随机整数 并且 包含这2个整数
        // Math.floor(Math.random() * (max - min + 1)) + min;
        function getRandom(min, max) {
    
            return Math.floor(Math.random() * (max - min + 1)) + min;
        }
        console.log(getRandom(1, 10)); 
        // 5. 随机点名  
        var arr = ['张三', '张三丰', '张三疯子', '李四', '李思思', '冰冰'];
        // console.log(arr[0]);
        console.log(arr[getRandom(0, arr.length - 1)]);
    </script>
</head>
<body>

</body>
</html>

05 - 猜数字游戏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>05 - 猜数字游戏</title>
    <script>
        // 猜数字游戏
        // 1.随机生成一个1~10 的整数  我们需要用到 Math.random() 方法。
        // 2.需要一直猜到正确为止，所以需要一直循环。
        // 3.while 循环更简单
        // 4.核心算法：使用 if  else if 多分支语句来判断大于、小于、等于。
        function getRandom(min, max) {
    
            return Math.floor(Math.random() * (max - min + 1)) + min;
        }
        var random = getRandom(1, 10);
        var count = 0;
        while (true) {
     // 死循环
            var num = prompt('你来猜？ 输入1~10之间的一个数字');
            if (num > random) {
    
                alert('你猜大了');
            } else if (num < random) {
    
                alert('你猜小了');
            } else {
    
                alert('你好帅哦，猜对了');
                break; // 退出整个循环结束程序
            }
            count++;
            if(count == 3) {
    
                alert('机会用尽');
                break;
            }

        }
        // 要求用户猜 1~50之间的一个数字 但是只有 10次猜的机会
        random = getRandom(1,50);
        for(var i = 1; i <= 10; i++) {
    
            num = prompt('你来猜？输入1-50之间的一个数字');
            if(num > random) {
    
                alert('你猜大了');
            } else if (num < random) {
    
                alert('你猜小了');
            } else {
    
                alert('你好棒哦，猜对了，用了' + i + '次机会');
                break;
            }
            if(i == 10) {
    
                alert('机会用尽'
最低0.47元/天 解锁文章
柑橘味柚芽
关注
  • 0
    点赞
  • 踩
  • 7
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
实验二 数据类型与常用内置对象（长沙理工大学）
Junds0的博客
10-19 1043
根据提示，在右侧编辑器补充代码，生成【1,100】的随机浮点数，并且保留2位小数，直接生成【1,100】的随机整数。（要求使用随机数种子，其值从键盘输入）。本关任务：生成【1.100】的随机浮点数，并且保留2位小数，直接生成【1,100】的随机整数。根据提示，在右侧编辑器补充代码，计算并输出数学表达式的值。根据提示，在右侧编辑器补充代码，计算两数相除的商和余数。本关任务：计算机数学表达式的值。本关任务：计算两数的商和余数。开始你的任务吧，祝你成功！开始你的任务吧，祝你成功！开始你的任务吧，祝你成功！
JavaScript基础第06天笔记1
08-03
在JavaScript基础的第六天学习中，我们深入探讨了数学运算、日期处理以及数组操作等核心概念。 1. **数学运算** - `Math.PI`：这是一个常量，表示圆周率π的值。 - `Math.floor()`：这个函数将数字向下取整，返回...
JavaScript基础2 内置对象 字符串对象 简单复杂数据类型
kaieew12345的博客
09-08 174
1 - 内置对象 1.1 内置对象 ​JavaScript 中的对象分为3种：自定义对象 、内置对象、 浏览器对象 ​前面两种对象是JS 基础 内容，属于 ECMAScript； 第三个浏览器对象属于 JS 独有的， JS API 讲解内置对象就是指 JS 语言自带的一些对象，这些对象供开发者使用，并提供了一些常用的或是最基本而必要的功能（属性和方法），内置对象最大的优点就是帮助我们快速开发 ​ JavaScript 提供了多个内置对象：Math、 Date 、Array、String等 1.2 查文档
JavaScript中的内置类
每天积累一点点
04-23 340
JS中的内置类 Object 对象类（基类） Number数字类 0，NaN 1.3都是数字类的实例 String Boolean Null Undefined Array 每一个数组都是Array的实例 RegExp Function Date HTMLCollection 每个元素集合都是它的实例 NodeList ClassList … EventTarget node（element（...
JavaScript-对象和内置对象
Sco_jing的博客
05-28 1525
文章目录1. 对象1.1 创建对象利用字面量创建对象利用new Object创建对象利用构造函数创建对象1.2 new关键字1.3 遍历对象属性小结1.4 变量、属性、函数、方法总结2. 内置对象2.1 查文档2.2 Math对象 1. 对象 在JS中，对象是一组无序的相关属性和方法的集合，所有事物都是对象，例如字符串、数值、数组、函数等。对象是具体的事物 对象是由属性和方法组成的，是属性和行为的结合体 属性：事物的特征，在编程中也叫成员变量、数据成员（常用名词） 方法：事物的行为，用方法表示（常用动词）
Python基础--常用数据类型（常用内置对象）
weimingqiu的博客
09-03 426
对象类型 示例 数字 1,  3.14,  3+4j 字符串 'abc', "hello world", '''Python ''' 日期 2016-08-25 列表 [1, 2, 3] 字典 {1:'food' ,2:'taste', 3:'imp
李立超JavaScript基础篇笔记
02-02
JavaScript，简称JS，是由Brendan Eich在1995年创造的一种高级编程语言，最初目的是为了增强网页的交互性，特别是在前端进行表单验证。...这些类型构成了JS编程的基础，理解和掌握它们是学习JavaScript的第一步。
javascript入门笔记
05-15
Javascript Basic 1、Javascript 概述(了解) Javascript，简称为 JS，是一款能够运行在 JS解释器/引擎 中的脚本语言 JS解释器/引擎 是JS的运行环境： 1、独立安装的JS解释器 - NodeJS 2、嵌入在浏览器中的JS...
JavaScript学习笔记
11-28
以上只是JavaScript学习笔记的部分内容，JavaScript还包括DOM操作、事件处理、Ajax异步通信、Promise、async/await、模块化（CommonJS、ES模块）、闭包、作用域链等丰富知识。深入学习JavaScript将帮助开发者构建更...
JavaScript高级程序设计阅读笔记（六） ECMAScript中的运算符（二）
12-10
1、加法运算符： 代码如下: var iResult=1+2; console.log(iResult);//outputs 3 特殊性： 某个运算数是NaN，结果为NaN Infinity加Infinity，结果为Infinity -Infinity加-Infinity，结果为-Infinity Infinity加-...
js 实现 奇偶数的判断
03-30
js 实现 奇偶数的判断! 值得下载看看!资源免费,大家分享!!
JavaScript对象与内置对象
修行的凡人的博客
11-17 633
自我学习得出的JavaScipt对象与内置对象知识点
基本数据类型和常用内建对象
dieshitun4694的博客
02-16 126
javascript中的基本数据类型： 1、字符串—可以视为String对象来使用String对象的相关属性； 2、数值类型 3、布尔类型 特殊数据类型是： <1>Null ——没有保存有效的数、字符串、boolean、数组或对象； 　　　　 <2>Undefined ——表示对象属性不存在， 声明了变量但从未赋值。 相关概念解释：内建对象——javasc...
Javascript 内置类型
lucky_ax的博客
06-02 232
JavaScript有七种内置类型 空值(null) 未定义(undefined) 布尔值(Boolean) 数字(number) 字符串(string) 对象(object) 符号(symbol,ES6新增) 除对象之外,其他都统称为"基本类型" 我们可以用 typeof 运算符来查看值的类型,它返回的是类型的字符串值,有意思的是,这七种类型和他们的字符串并不一一对应 console.log(typeof undefined === "undefined"); /
javascript中的内置类型
messenger的博客
06-08 2147
原文链接：https://www.w3cschool.cn/javascript/javascript-built-in-types.html 我们可以使用new Object()创建和使用自定义对象。 Javascript有许多其他引用类型。 内置类型有: 类型 描述 Array 数字索引值的有序列
js里==和===
Donnie的专栏
03-05 575
”==”与”===”是不同的,一个是判断值是否相等,一个是判断值及类型是否完全相等。 下面的规则用于判定===运算符比较的两个值是否相等的判断条件 •如果两个值的类型不同，它们就不相同。 •如果两个值是数字，而且值相同，那么除非其中一个或两个都是NaN(这种情况它们不是等同的),否则它们是等同的。值NaN永远不会与其他任何值等同，包括它自身(奇怪的家伙),要检测一个值是否是NaN，可以使用全局函数
js总结之对象和内置对象
qq_44243203的博客
10-18 175
对象和内置对象 Object 对象就是属性的无序集合。数组是有序集合。 1. 创建对象的方法 自定义对象 var dog = { 2: 'iii',//dog[2]，不能dog.2 age: 2,//访问用dog.age / dog['age'] sex: '公',//2、age、sex属于静态体征 eat: function () { console.log(this.age) }//eat属于动态行为(即
python常用数据类型，内置对象的说明。
afluos_serinder的博客
07-16 358
f=open（'data.dat',rb)-----open是python的内置函数，使用指定的模式打开文件，返回文件对象。所有元素放在一个大括号内，元素之间逗号分隔，元素不许重复，另外set是可变，而frozset是不可变的。注意，在交互式界面中我键入的是小写的"L"----"l",而不是阿拉伯数字---“1”所有元素放在一个括号内，元素之间用逗号相隔，如果元组中只有一个元素的话，后面的逗号不能省略。**上面的条件为在列表的最后添加，下面的方法则是在固定位置加入新的字符。...
js内置对象和基础数据类型
FrozenNoodle的博客
11-11 340
js内置对象（内置方法）： Boolean() String() Object() Function() Array() Regexp() Date() Error()
html+css+javascript笔记
最新发布
12-29
以下是一个简单的HTML+CSS+JavaScript笔记的示例： ```html <!DOCTYPE html> <html> <head> <title>HTML+CSS+JavaScript笔记</title> <link rel="stylesheet" href="demo.css"> <style> /* 在demo.css中定义的样式 */ div { color: red; } </style> </head> <body> <div> 这是一个HTML文档中的区域部分。 </div> <script> // JavaScript代码示例 var message = "这是一个JavaScript变量"; console.log(message); </script> </body> </html> ``` 在上面的示例中，我们创建了一个HTML文档，引入了名为demo.css的CSS文件，并在HTML中使用了一个div元素来定义一个区域部分。在demo.css中，我们为div元素设置了红色的文字颜色。此外，我们还在JavaScript代码块中定义了一个变量，并使用console.log()函数在浏览器的控制台中输出了该变量的值。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值