JavaScript

JavaScript

特点

1.直译式脚本语言(代码不用预编译,在程序的运行过程中逐行进行解释)

2.一种动态类型、弱类型、基于原型的语言

3.它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,在HTML网页上使用,用来给HTML网页增加动态功能,能在浏览器中实时浏览到交互效果。

4.兼容性问题: IE6、7、8是个怪胎,对JavaScript语法有兼容性问题,所以要写兼容写法。

5.花式写法很多,抽象:从简单入手,细细品味代码

alert ()弹窗

  1. alert 就是英语中“警报”的意思,能够让页面弹出警告框。让浏览器弹出一个窗口,窗口里的内容就是alert()中的内容。

  2. JS程序是顺序

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>hello</title>
        <script>
            // 弹窗
            alert("hello word!");
            //  控制台 打印 console.log()
            console.log("hello word!");
            // 单行注释 ctrl+/
            /* 多行注释*/
        </script>
    </head>
    <body>
        <script type="text/javascript">
            // type可以不写,写了一定要写对
        </script>
    </body>
    </html>
    

控制台console.log()

1.控制台是 浏览器“检查”或者“检查元素”里面的功能,快捷键是 F12。英文叫做 console。程序运行后所产生的错误,都会在控制台中输出,控制台是调试程序的一个利器。语句中不能出现中文的符号,出现中文符号会出现语法错误:

2.有些时候我们想在控制台中自己输出点什么,那么就要使用语句:console.log();console 就是控制台,log 就是日志的意思,这里是动词,表示打印。console.log(“你好啊");

  1. alert(“你好啊!”); 这是一条语句JS中的每条语句以分号 ; 结尾。如果语句是一行一行写的,没有分号结尾也是有效语句。但项目做好后,通常都会进行压缩,用软件把所有的空格、换行都去掉。此时,语句末尾的分号显得非常重要,如果去掉分号,将不能执行。注意:所有的符号都是英文的符号,不要用中文

    <script  type="text/javascript">	
        alert("你好");alert("帅");alert("哈哈哈哈");</script>
    

JavaScript空格、换行

JavaScript 语句和语句之间的换行、空格、缩进都不敏感,会忽略多余的空格。可以向脚本添加空格缩进,来提高其可读性。

注释

1.单行注释

//注释内容不可换行

<script  type="text/javascript">	
    //我是一行注释	
    //再来一行	
    alert("你好");
</script>
  1. 块级/多行注释

    /* 注释内容可以换行 */

    <script  type="text/javascript">	
        /* 我是一行注释  
        再来一行        
        再来一行    */	
        alert("你好");
    </script>
    

3.注释用于提高代码的可读性编辑器里注释的快捷键一般是: ctrl+/注意:注释的符号,不能嵌套

书写方式

1.内部书写

在HTML文件中直接进行代码的书写,JS 写在

注意:这个 type必须写准确,可以不写,但是要写,一定要写准确,否则失效。

<script>
    // 1.使用script标签引入js,script标签可以放在任何位置
	console.log("内部引入");
</script>

2.外部引入

<!-- 使用外部js,类似于css的引入
    可以在任何地方引入 -->
    <script src="js/a.js"></script>

3.直接写在HTML标签内(不推荐使用)

<!-- 在标签内使用,不建议 -->
    <button onclick="alert('你好啊!')">点一下</button>

标识符

1.就是一个名字,用来对变量、函数、属性等进行命名。

2.标识符命名规范:

第一个字符必须是一个字母、下划线(_)或一个美元符号($);

其他字符可以是字母、下划线、美元符号或数字;

不能含有空格;

不能以关键字或保留字命名。

  1. 关键字、变量、函数名及所有的标识符都区分大小写

    比如:变量ABC; 和 变量abc;

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>变量标识符</title>
    </head>
    <body>
        <script>
            // 标识符:字下美其后数(字母 下划线 美元 数字)
            // 见名知意
            // var age;sex;phone;email;adress;
            // 声明
            var name;
            // 赋值 =
            name="小马";
    
            // 边声明边赋值
            var age=18;
            // 一次声明多个变量
            var a,b,c,d;
            a=10;
            b="试试";
            c="ff";
            d=32.5;
            // 张三,20,男,爱好:女
            var name1="张三";
            var age1=20;
            var sex1="男";
            var hobby1="女";
            console.log(name1);
            console.log(age1);
            console.log(sex1);
            console.log(hobby1);
            // 变量使用前必须先声明才可以使用
            // console.log(name2);
    
            // 变量可以不声明直接赋值并使用,不建议使用
            name3="张三丰";
            console.log(name3);
    
            // 声明,未赋值的变量,使用时会出现错误提示 undefined
            var aaa;
            console.log(aaa);
        </script>
    </body>
    </html>
    

关键字

关键字可用于表示控制语句的开始或结束,或者用于执行特定操作等。Javascript 中的很多内置功能用关键字标注起来,便于程序员调用。按照规则,关键字也是语言保留的,不能用作标识符。

例:break do instanceof typeofcase else new varcatch finally return voidcontinue for switch whilefunction this with defaultif throw delete intry

保留字

保留字有可能在将来被用作关键字来使用,不能用作标识符。

例:abstract int short booleanexport interface static byteextends long super charfinal native class floatthrows const goto privatedouble import public

变量

1.变量是存储信息的容器.

JavaScript的变量为弱变量,可以用来保存任何类型的数据。

C语言,JavaScript,int定义整型数据,char定义字符型,float定义浮点型,

在JS中,只有var这一种声明变量的类型,它可以声明各种类型的数据

2.定义变量——使用关键字 var 声明。var 就是英语 variables 变量的缩写

var a; 定义一个变量a,电脑内存中,就会开辟一个空间,来存储这个变量 a。可以给这个变量赋值,JS 中给变量赋值用等号,等号右边的值赋给左边

​ var a=20;

​ console.log(a);

可以通过var声明多个变量,变量与变量之间以,逗号隔开

var a=20,b=100;

console.log(a,b);

变量的命名规范

1.第一个字符必须是一个字母、下划线(_)或一个美元符号($);

2.其他字符可以是字母、下划线、美元符号或数字;

3.不能含有空格;

4.不能以关键字或保留字命名.

变量须先声明

使用一个变量,必须先进行一个 var,才能使用。 var 这个过程可以叫做声明 declaration,也可以叫做定义 definition。

直接运行语句:

​ console.log(b); //这个 b 没有通过var声明,所以要报错

变量的赋值

变量的赋值用等号,等号就是赋值符号

变量声明的提升

1.JS 只能提升变量的声明,而不能提升变量的赋初值

2.没有通过var定义变量,程序没有报错,正常输出值。但用var和不用var定义变量是有区别的,作用域那一节再具体讲述。

字面量

1.在计算机科学中,字面量(literal)是用于表达源代码中一个固定值的表示法(notation)。由字母,数字等构成的字符串或者数值,它只能作为右值出现,所谓右值是指等号右边的值。

2.字面量分为:字符串字面量(string literal )、数字字面量、数组字面量(array literal)和对象字面量(object literal),另外还有函数字面量(function literal)。

var a=1; // 1是数字字面量

var b=“你好”; // ”你好“ 是字符串字面量

var c=[1,2,3]; // [1,2,3]是数组字面量

var d={“age”:”10”} // {“age”:”10”}是对象字面量

function myFunction(a, b) { return a * b;} // 函数字面量

区分变量还是字面量

输出变量的时候,不能加引号。如果变量加上引号,就变成字符串了.

var a = 100;

console.log(“a"); // 这里输出a,而不是输出100

引号是“字符串”的定界符,在双引号里面的 a 已经失去了变量的意思,代表的就是一个字符串 a。

数据类型

1.可分为原始类型和对象类型,也可以分为可变类型和不可变类型。

2.可变类型的值是可修改的。对象和数组属于可变类型;数字、布尔值、NULL和undefined属于不可变类型。字符串可以看成由字符组成的数组,但是是不可变的。

3.五种原始数据类型

Number 值是数字

String 值是字符串

Boolean 值为布尔值 只有true或false—真或假

Undefined 值未定义

Null 值为空 (空对象)

4.一种复合数据类型 Object

对象object、数组Array、函数Function等都属于object类型

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>数据类型</title>
</head>
<body>
    <script>
        // number 数字
        var a=12;
        var b=32.4;
        var c=-99;
        // 八进制  第一位是0后边是0~7组成的数字
        var d=0o123;
        console.log(d);
        // 运行没有错误,但是代码会报错,不影响
        // var e=0123;
        // console.log(e);
        // 十六进制 前面两位必须是0x 后面跟任何十六进制数字(0~9和a~f)a和f不区分大小写
        var f=0x789;
        var g=0xABC;

        // String
        // 字符串 是存储字符的变量
        // 必须用双引号或者单引号包裹着
        var h="你好";
        var i='你好';
        // 如果变量的标识符被加上引号,就不再是变量,就变成了字符串
        var j="f";
        // 你好"张三"
        var k='你好"张三"';
        console.log(k);
        var l="你好'张三'";
        console.log(l);
        // 你是"狗"么?不是'狗'
        var m="你是\"狗\"么?不是'狗'";
        console.log(m);
        var n="d:\\a\\a.html";
        console.log(n);
        var o="hello \nword!";
        console.log(o);

        // 检测数据类型
        console.log(typeof a);
        console.log(typeof o);
        console.log(typeof 2);
        console.log(typeof 'sdfghj');
        console.log(typeof "3");
        // boolean 布尔类型 true false
        // true和false不能加引号
        var p=true;
        var q=false;
        // underfined类型
        // 使用var声明变量但未对其赋值,这个变量就是undefined。
        var r;
        console.log(typeof r);
        // 空 null类型 检测null是会是obiect
        var s=null;
        console.log(typeof s);
    </script>
</body>
</html>

数据类型检测

数据类型检测:typeof(x) 或 typeof x

例:var a = 100;

​ var b =“小明”;

​ console.log(typeof a); // 输出number

​ console.log(typeof b); // 输出string

string类型

1.字符串是存储字符的变量。

2.字符串的字面量,必须用双引号、单引号包裹起来。

​ 字符串被限定在同种引号之间,即必须是成对单引号或成对双引号。

var str1=“今天天气很好”;

必须是同种引号,下面的写法是错误的:var str2=‘哈哈”;

一个数字用引号包裹起来,就是字符串类型:var str3=“3”;

3.正常情况下,双引号里面只能用单引号或者单引号里只能用双引号:

var str4=“老师说你像’考拉’一样漂亮”;

var str5=‘老师说你像"考拉"一样漂亮’;

4.双引号内部如果要使用相同的引号,可以使用 \ 反斜杠进行转义:

var str6=“老师说你像"考拉"一样漂亮";

反斜杠自己也用反斜杠来转义:

var str7=“c:\a\b.jpg”);

5.常用的转义字符:

\n 回车换行var str8=“你好\n啊\n我是谁\n啊”;

Boolean类型

1.布尔(逻辑)只能有两个值:true 或 false。布尔值常用在条件测试中.

var a=true;

var b=false;

2.Boolean类型中,字符串、非 0 数字、对象,将返回true ;空字符串、数字0、undefined、 null、NaN,将返回 false。

Boolean类型转换

把其它类型转化为Boolean的方法:

Boolean() 属于强制类型转换方法

Undefined类型

使用var声明变量但未对其赋值,这个变量就是undefined。

​ var a;

​ console.log(a); //undefined

声明变量以后输出和未声明变量输出区别:

​ var a; console.log(a); //undefined

​ console.log(b); //没有声明b,报错

Null类型

从逻辑角度看,null值表示一个空对象指针,所以typeof操作符检测null时会返回“object”。

​ var a = null;

​ console.log(typeof a); //object

Undefined值派生自null,所以ECMA-262规定对它们的相等性测试要返回true。

​ console.log(null == undefined); //true

​ console.log(null === undefined); //false

Null和Undefined类型的用法(在此只做了解)

null和undefined基本是同义的,只有一些细微的差别,典型用法是:

null表示”没有对象”,即该处不应该有值。

(1) 作为函数的参数,表示该函数的参数不是对象。

(2) 作为对象原型链的终点。undefined表示”缺少值”,就是此处应该有一个值,但是还没有定义。(1)变量被声明了,但没有赋值时,就等于undefined。

(2) 调用函数时,应该提供的参数没有提供,该参数等于undefined。

(3)对象没有赋值的属性,该属性的值为undefined。

(4)函数没有返回值时,默认返回undefined。

Number类型

JavaScript 唯一的数字类型,不再细分为整型int、浮点型float等.

数字字面量:十进制、八进制和十六进制

​ 十进制数:最基本的数字

​ var a=34;

​ var b=100;

​ 八进制数:八进制字面值第一位必须是零,后面的数字必须是0~7之间的数,超出范围 ,前面的零被忽略,数值当作十进制解析.

​ var num1=070; //八进制的56

​ var num2=079; //无效的八进制,解析为79

​ var num3=08; //无效的八进制,解析为8

​ 十六进制数:十六进制字面值前两位必须是0x,后跟任何十六进制数字(09和AF)。A~F不区分大小写。

​ var num1 = 0xA; //十六进制的10

​ var num2 = 0x1f; //十六进制的31

提示:尽管所有整数都可以表示为八进制或十六进制的字面量,但所有数学运算返回的都是十进制结果.

Number类型转换

把其它类型转化为number的方法:

1.Number () 属于强制类型转换方法

把变量的值转换为数字,转换的是整个值,而不是部分值。如果变量的值无法转换为数字,那么 Number() 函数返回 NaN。

2.parseInt (string,radix) 可解析一个字符串,并返回一个整数。

string 必填项,表示要解析的字符串;

radix 可选项,表示要解析的数字的基数(进制数)。介于2-36之间,如果该参数小于2或者大于36,则parseInt()将返回NaN。

注意:只有字符串中的第一个数字会被返回。开头和结尾的空格是允许的。如果字符串的第一个字符不能被转换为数字,那么 parseInt() 会返回 NaN

3.parseFloat (string) 可解析一个字符串,并返回一个浮点数。

注意: 开头和结尾的空格是允许的。 如果字符串的第一个字符不能被转换为数字,那么 parseFloat() 会返回 NaN。 如果只想解析数字的整数部分,请使用 parseInt() 方法。

4.什么情况下会产生NaN?

NaN(Not a Number的缩写)是number类型里的特殊值,当做数学运算失败的时候,或当其它数据类型转化为number类型失败的时候,会得到NaN的结果。

5.isNaN() 用于检查变量是否是非数字值。

如果把NaN 与任何值(包括其自身)相比得到的结果均是 false,所以要判断某个值是否是 NaN,不能使用 == 或 === 运算符。正因为如此,isNaN() 函数是必需的。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>js数据转换</title>
</head>
<body>
    <script>
        // Number()  把变量强制转换成数字
        // NaN 非数字
        var str1="123";
        var str2="0o1234";
        var str3="0xA123F4";
        var str4="aa";
        var str5='a';
        console.log(Number(str1));
        console.log(Number(str2));
        console.log(Number(str3));
        console.log(Number(str4));
        console.log(Number(str5));
        console.log("-----------------------------");
        // 转换成整数 parseInt
        console.log(parseInt("123.8"));
        console.log(parseInt("1234a5"));
        console.log(parseInt("a123"));
        console.log(parseInt("1.2.3"));
        console.log(parseInt(null));
        console.log(parseInt(false));
        console.log("-----------------------------");
        // 转换为浮点数(小数)
        console.log(parseFloat("123"));
        console.log(parseFloat("123.33"));
        console.log(parseFloat("123.3.4"));
        console.log(parseFloat(" 123.2"));
        console.log("-----------------------------");
        // 检查是不是 非数字 false-->数字  true-->非数字
        console.log(isNaN(123));
        console.log(isNaN("123"));
        console.log(isNaN("a"));
        // console.log(isNaN(c));
    </script>
</body>
</html>
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值