续-初识JAVaScript---(2)

这篇具有很好参考价值的文章主要介绍了续-初识JAVaScript---(2)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

初识JavaScript ———(2)!!!

一、关于JavaScript中的数据类型

虽然在JS中的变量在声明的时候不需要指定数据类型,但是在赋值的时候,每一个数据还是有类型的,所以还是需要学习JS中的数据类型。

JS的数据类型遵循ES规范(ECMAScipt规范),在ES6之后,又基于以下的六种类型之外添加了一种新的类型:Symbol

1.数据类型的分类

(1)原始类型

在JS中的原始的数据类型有:Undefined、Number、String、Boolean、Null

(2)引用类型

在JS中的引用的数据类型有:Object以及Object的子类

JS中有一个运算符叫做typeof,这个运算符可以在程序的运行阶段动态的获取变量的数据类型。以下是typeof运算符的语法格式:

typeof 变量名

typeof运算符的运算结果是以下6个字符串之一,注意字符串都是全部小写。

“undefined” “number” “string”

“boolean” “object” “function”

在JS中比较字符串是否相等使用“==”完成,不是使用equals。

Demo:要求a变量和b变量的数据类型必须是数字,不能是其他变量,也就是限制了变量的数据类型

<html>
    <head>
        <meta charset="UTF-8">
        <title>My_javascript</title>
    </head>
    <body>
        <script type = "text/javascript">
               function sum(a,b) {
                    if(typeof a == "number" && typeof b == "number") {
                        return a + b;
                    }
                    alert(a+","+b+"必须都为数字!");
               }
               //正确的方式:
               var ret = sum(2,3);
               alert("ret = "+ret);
               //错误的方式:
               var ret2 = sum(false,"abc");
               alert("ret = "+ret2);
           </script>
    </body>
</html>

正确的执行结果:

续-初识JAVaScript---(2)

错误的执行结果:

续-初识JAVaScript---(2)

续-初识JAVaScript---(2)

由于代码执行到了alert(a+","+b+"必须都为数字!");这句,说明sum函数并没有返回值,即ret2也没有接受到返回值,默认为undefined。

Demo:关于typedef的六种类型

<html>
    <head>
        <meta charset="UTF-8">
        <title>My_javascript</title>
    </head>
    <body>
        <script type = "text/javascript">
               var i;
               alert(i+"的数据类型为"+typeof i);

               var num = 3;
                alert(num+"的数据类型为"+typeof num);

               var str = "abc";
                 alert(str+"的数据类型为"+typeof str);

               var flag = false;
                alert(false+"的数据类型为"+typeof false);

               var d = null;
                alert(d+"的数据类型为"+typeof d);
            
               

           </script>
    </body>
</html>

续-初识JAVaScript---(2)

注:null属于Null类型,但是typeof运算符的结果类型是“object”.

2.Undefined类型

Undefined类型只有一个值,这个值救赎undefined,当一个变量没有手动赋值,系统默认赋值undefined,或者也可以给一个变量手动赋值undefined。

var i;     //类型为undefined
var k = undefined;    //类型为undefined
alert(i==k);   //true

var j = "undefined";   //类型为string
alert(j==k);   //false

3.Number类型

(1)NUmber类型有哪些值?

整数、小数、负数、正数、不是数字、无穷大都属于Number类型(0、1、1.2、-1、NaN、Infinity)

关于NaN:表示Not a Number,不是一个数字,但属于Number类型。比如当运算结果应该是一个数字,最后算完不是一个数字的时候,结果就是NaN。

如,Demo:

 var a = 100;
 var b = "abc";
 alert("结果="+a/b);

续-初识JAVaScript---(2)

但是如果做的是加法运算,加号的一边为字符串时,先做字符串的拼接。Demo:

var a = 100;
var b = "abc";
alert("结果="+(a+b));

续-初识JAVaScript---(2)

4.Infinity类型

关于Infinity类型是当除数为0时,结果为无穷大。

alert(10/0);

续-初识JAVaScript---(2)

思考:alert(10/3)=?

续-初识JAVaScript---(2)

5.isNaN函数

用法:isNaN(数据),这个结果为true表示不是一个数字,结果为false表示是一个数字。因为isNaN的意思为:is Not a Number。

再对于之前,效果可和ypeof关键字替换,Demo:

<html>
    <head>
        <meta charset="UTF-8">
        <title>My_javascript</title>
    </head>
    <body>
        <script type = "text/javascript">
            function sum(a,b){
                if(isNaN(a) || isNaN(b)){
                    alert("参与运算的必须是数字!!!");
                    return;
                }
                return a+b;
            }
            var ret = sum(3,2);
            alert("ret="+ret);
        </script>
    </body>
</html>

续-初识JAVaScript---(2)

6.parseInt( )函数和parseFloat函数

parseInt( )函数作用:可以将字符串自动转换成数字,并且取整数位。

parseFloat( )函数作用:可以将字符串自动转换成数字

Demo:

alert(parseInt("3.9999"));//3
alert(parseInt(3.9999));//3
alert(parseFloat("3.2")+1);//4.2

7.Math.ceil函数

Math.ceil函数作用:将数字进行向上取整,Math是数学类,数学类中有一个ceil( ),作用是向上取整。

alert(Math.ceil(2.1));

结果就是3

8.Boolean类型

JS中的Boolean类型永远就只有两个值,true and false(和Java一样)。

在Boolean类型中有一个函数叫做:Boolean( ).

语法格式:

Boolean(数据)

其作用是将非布尔类型转换成布尔类型。

Demo1:

var username = "";
if(username) {
     alert("欢迎你"+username);
}else {
     alert("用户名不能为空!");
}

Demo2:

var username = "";
if(Boolean(username)) {
     alert("欢迎你"+username);
}else {
     alert("用户名不能为空!");
}

Demo1和Demo2的代码含义是一样的,如果username中包含字符串,经过if语句判断,如果为真,即结果就是true,就会执行第一条语句alert("欢迎你"+username);但是我们一般采用第一种写法,代码底层会自己变化。

alert(Boolean(1));//true
alert(Boolean(0));//false
alert(Boolean(""));//false
alert(Boolean("abc"));//true
alert(Boolean(null));//false
alert(Boolean(NaN));//false
alert(Boolean(undefined));//false
alert(Boolean(Infinity));//true

总结:Boolean函数中有内容就转换成true,没有内容就是false。

9.Null类型

Null数据类型就一个值,null

注:alert(typeof null);这个代码的结果是object

10.String数据类型

(1)在JS当中字符串可以使用单引号,也可以使用双引号。

var str1 = "abc";

var str2 = 'abc';

(2)在JS中使用两种方式创建字符串:

  • var str = "abc";
  • 使用JS中内置的支持类(String),var str2 = new String("abc");注意,String是一个内置类,可以直接使用,String的父类是Object。
//小string(属于原始类型String)
var x = "abc";
alert(typeof x); //结果为string

//大String(属于Object类型)
var y = new String("abc");
alert(typeof y); //结果为object
  • 但是不管小string 还是大String,他们的属性和函数都是通用的。

(3)关于String类型常用的属性和函数?

  • 常用属性:
    • length 获取字符串长度
  • 常用函数:
    • indexof 获取指定字符串在当前字符串第一次出现处的下标
    • lastIndexof 获取指定字符串在当前字符串最后一次出现处的下标
    • replace 替换
    • substring 截取子字符串
    • toLowerCase 转换成小写
    • toUpperCase 转换成大写
    • split 拆分字符串

11.Object数据类型

Object是所有类型的超类,自定义的任何类型,默认继承Object。

(1)JS常见的属性

常见的属性:prototype属性(这个属性主要是给类动态的扩展属性和函数)、constructor属性

(2)JS中常见的函数

在JS中有toString、valueOf、tolocaleString函数等等

注:Object当中定义的类默认继承Object,会继承Object类中的所有属性以及函数,也就是说,自己定义的类中也有prototype属性

(3)在JS中如何定义类?又如何new对象?

  • 定义类的第一种方式:
    • function 类名(形参){};
  • 定义类的第二种方式:
    • 类名 = function(形参){};
  • 创建对象的方式:
    • new 类名(构造方法名)(形参);

Demo:

function test() {
            
            }
test();//这样用就是一个函数
            
var obj = new test();//这样用,object就是一个引用,保存内存地址指向堆中的对象。

(4)在JS中类的定义和构造函数的定义是一起完成的。

Demo:

function User(a,b,c) {
//this表示当前对象,User类中有三个属性:name、age、number
	this.name = a;
    this.age = b;
 	this.number = c;
}

//创建对象:
var user1 = new User("zhangsan",18,123);
//访问对象的属性:
alert(user1.name);     //zhangsan
alert(user1.age);      //18
alert(user1.number);   //123

二、null、NaN、undefined这三值的区别

1.数据类型不一样

null数据类型为object、NaN数据类型为number、undefined的数据类型为undefined

alert(null==NaN);        //false
alert(null==undefined);  //true
alert(undefined==NaN);   //false

//所以:null和undefined可以等同

注:在JS中有两个比较运算符

  • (1)“==”为等同运算符,只判断值是否相等
    • 例:alert(1==true);这个的结果就是true
  • (2)“===”为全等运算符,既判断值是否全等,也判断数据类型是否相等
    • 例:alert(1===true);这个的结果就是false,因为这两个的数据类型不一样

好了,本期的博客就到此结束,下一期还会继续讲解JavaScript语言的续集,请大家持续关注,谢谢!!!

既然选择远方,当不负青春,砥砺前行。文章来源地址https://www.toymoban.com/news/detail-506825.html

到了这里,关于续-初识JAVaScript---(2)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 在JavaScript中的栈数据结构(Stack )

    JavaScript 中可以通过数组实现栈数据结构。栈是一种遵循后进先出(LIFO)原则的数据结构,它只允许在栈顶进行插入和删除操作。 栈是一种遵从后进先出(LIFO)原则的有序集合。新添加的或待删除的元素都保存在栈的 同一端,称作栈顶,另一端就叫栈底。在栈里,新元素都

    2024年02月10日
    浏览(37)
  • JavaScript中的代理和反射:实现数据绑定和事件监听

    在JavaScript中,代理(Proxy)和反射(Reflect)是两个重要的概念,它们可以用于实现数据绑定和事件监听等功能。在本文中,我们将会探讨代理和反射的概念,以及如何使用它们实现数据绑定和事件监听。 代理是一种能够截获并拦截对象访问的机制。它可以用于在对象上定义

    2023年04月10日
    浏览(41)
  • Javascript中的图像数据对象:Image、ImageData 和 ImageBitmap

    前端处理图片数据,有提供几个常用的API,如Image、ImageData、ImageBitmap等等。这些对象可以为我们操作图片带来较大帮助,今天我们就详细介绍下这几个有用的对象接口。 前端处理图片,首先能想到的API就是 Image 对象。 它的主要作用是:能够加载一张图片资源,创建并返回一

    2024年02月03日
    浏览(16)
  • JavaScript中的数据类型可以分为两类:原始类型和引用类型。

    JavaScript中的数据类型可以分为两类:原始类型和引用类型。 JavaScript中的原始类型有五种,分别是: 数字(Number):表示数字,包括整数和浮点数。 字符串(String):表示文本字符串。 布尔值(Boolean):表示逻辑上的真或假。 undefined:表示未定义的值。 null:表示空值。

    2024年01月24日
    浏览(44)
  • JavaScript中的数据缓存与内存泄露:解密前端性能优化与代码健康

    ​🌈个人主页:前端青山 🔥系列专栏:JavaScript篇 🔖 人终将被年少不可得之物困其一生 依旧 青山 ,本期给大家带来JavaScript篇专栏内容:JavaScript-数据缓存与内存泄露 目录 说说你对事件循环的理解 一、是什么 二、宏任务与微任务 微任务 宏任务 三、async与await async await 四、

    2024年02月03日
    浏览(73)
  • 【JavaScript数据结构与算法】字符串类(反转字符串中的单词)

    个人简介 👀 个人主页: 前端杂货铺 🙋‍♂️ 学习方向: 主攻前端方向,也会涉及到服务端(Node.js) 📃 个人状态: 在校大学生一枚,已拿多个前端 offer(秋招) 🚀 未来打算: 为中国的工业软件事业效力 n 年 🥇 推荐学习:🍍前端面试宝典 🍉Vue2 🍋Vue3 🍓Vue2/3项目

    2023年04月09日
    浏览(89)
  • ArcGIS JSAPI 学习教程 - 初识 ArcGIS Maps SDK for JavaScript

    近期由于工作需要,开始接触 ArcGIS Maps SDK for JavaScript (以下简称 JSAPI ),为了更好的系统的学习,准备开设专栏,作为学习记录。 本文作为第一篇,首先介绍一下 JSAPI 的概览、官方示例以及官方 API。 然后完成 JSAPI 的 helloworld 以及注意事项。 最后简述一下 JSAPI 的优势劣势

    2024年01月19日
    浏览(53)
  • 12 JavaScript 关于eval函数

    12 eval函数 eval本身在js里面正常情况下使用的并不多. 但是很多网站会利用eval的特性来完成反爬操作. 我们来看看eval是个什么鬼? 从功能上讲, eval非常简单. 它和python里面的eval是一样的. 它可以动态的把字符串当成js代码进行运行. 也就是说. eval里面传递的应该是即将要执行的代

    2024年02月12日
    浏览(33)
  • JavaScript关于函数的小挑战

    回到两个体操队,即海豚队和考拉队! 有一个新的体操项目,它的工作方式不同。 每队比赛3次,然后计算3次得分的平均值(所以每队有一个平均分)。 只有当一个团队的平均分至少是另一个团队的两倍时才会获胜。否则,没有球队会赢! 创建一个箭头函数 \\\"calcAverage \\\"来计算

    2024年02月10日
    浏览(35)
  • 13 JavaScript关于prototype(超重点)

    13 JavaScript关于prototype(超重点) prototype是js里面给类增加功能扩展的一种模式. 写个面向对象来看看. 我现在代码写完了. 突然之间, 我感觉好像少了个功能. 人不应该就一个功能. 光会跑是不够的. 还得能够ooxx. 怎么办? 直接改代码? 可以. 但不够好. 如果这个类不是我写的呢?

    2024年02月12日
    浏览(37)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包