01—Javascript基础语法（笔记）

一、js的使用

1、行内代码

<div onclick="alert('你好世界')" >hello world</div>
<a href="javascript:alert('hello')">百度一下你就知道</a>

2、内部代码

<script>
    alert("内部代码");
</script>

3、外部代码

<script src= "./外部链接"></script>

 二、理解window对象

1、window对象的方法

window提供的几个关于对话框的方法

警告框

//警告框
window.alert('警告框');

 确认框

//确认框
window.confirm('是否确认进行该操作');

输入框

//输入框
window.prompt('请输入内容');

2、window对象的属性

日志打印

//日志打印
window.console.log("hello world");

打印一个对象的所有属性和方法

//打印一个对象的所有属性和方法
window.console.dir(window);

写入到文档

//写入到文档
windo.console.write("进击的风筝");

window对象是顶层对象，在访问window对象下的属性和方法时，可以省略window不写

三、变量

1、定义变量

与java不同，js声明变量通过 var 关键字

//变量的初始化
var a = 10;
//创建变量
var b;
//给变量赋值
b = 20;
console.log(a);
console.log(b);

//也可以同时创建多个变量(但是不推荐)
var a, b, c, d;

//省略var关键字，所得到的是全局变量
name = "进击的风筝";
console.log(name);

2、变量的声明提升

变量被定义之后，你可以通过变量名称读取变量的值：

var a = 'Hello world';
console.log(a);

但是，在变量定义代码之前，通过变量名称读取变量的值，则会出现 undefined

console.log(a); // undefined
var a = 'Hello world';

由于变量的声明会被提升到当前作用域的最顶端，而赋值并不会被提升，因此上面的代码输出 undefined。可以使用下面的代码解释：

var a;
console.log(a); // undefined
a = 'Hello world';

四、数据类型

1、基本数据类型

Number类型（数值型）：

        数字类型用于表示数值：整数、浮点数（小数）、+ -Infinity（正负无穷大）和 NaN (非数值，Not a Number)。

Boolean类型（布尔型）：

        布尔类型表示一个逻辑值，有两个值：true 和 false。

String类型（字符串型）：

        字符串类型用于表示文本数据，使用单引号（推荐）或双引号括起来，如：' Hello World '。

Undefined类型

        Undefined 类型只有一个值，即 undefined。任何一个只声明而没有赋值的变量都会被隐式的(自动的)赋值为 undefined。

Null类型

        Null 类型也只有一个值，即 null。null是表示缺少的标识，指示变量未指向任何对象。把 null作为尚未创建的对象，也许更好理解。

2、引用数据类型

        以Object对象为例，Object对象是一组属性的集合。属性包含一个属性名和一个属性值

var obj = {
    name: "进击的风筝",
    age: 18,
    gender:"未知"
};

3、检测数据类型

        通过 typeof 检测数据类型

1、检测基本数据类型

var num = 10;
console.log(typeof num);        // number
var str = "进击的风筝";
console.log(typeof str);        // string
var bool = true;
console.log(typeof bool);       // boolean
var und = undefined;
console.log(typeof und);        // undefined
var empty = null;
console.log(typeof empty);      // object

2、检测引用数据类型

var obj = {
            name: "进击的风筝",
            age: 18
        }
        console.log(typeof obj);        // object

总结：js 的 typeof 返回的数据类型有：string,  boolean,  number,  undefined,  object

4、数据类型的转换（重点）

1、其他类型转成Boolean

//直接使用Boolean()
 console.log(Boolean());

转化成 false 的有：undefined   null   0   ' '    NaN

转化成 true 的有：非空字符串、非零数字、对象

console.log(Boolean(9527)); // true
console.log(Boolean({myname: 'xiaogu'})); // true
console.log(Boolean('abcd')); // true

2、其他类型转成Number

（1）Number()

        var num1 = "123.321";
        console.log(Number(num1));
        var str1 = "abc";
        console.log(Number(str1));      // NaN
        var str3 = "";
        console.log(Number(str3));      // 0
        var bool1 = true;
        console.log(Number(bool1));     // 1
        var bool2 = false;
        console.log(Number(bool2));     // 0
        console.log(Number(und));       // NaN
        console.log(Number(empty));     // 0

（2）parseInt()

（3）parseFloat()

3、其他类型转成String

1、转化为字符串

用string()将其他类型转化成字符串，适用于所有类型

console.log(String( ));

用tostring()将其他类型转化字符串，适用于除null和undefined外的类型       

var num = 1;
console.log(num.toString());

4、隐式类型转换

利用隐式转换将字符串类型的数据转换成Number

// 当非数字类型的字符串相减时，结果都等于NaN
console.log('abc' - '18'); // NaN

// 当数字类型的字符串进行
// 减、乘、除、取余运算时，首先会将字符串转换成数字，
//然后再进行运算，最终的结果返回的是数值型。
console.log('28' - '18'); // 10 
console.log('3' * '4'); // 12 
console.log('32' / '4'); // 8 
console.log('12' % '5'); // 2 

利用隐式转换将其他类型的数据转换成 String类型。

console.log(12 + ''); // '12' 最终的结果返回的是字符型
console.log(12 + 3 + '4'); // '154'
console.log( '4'+ 12 + 3); // '4123'

使用方法时进行隐式类型转换，用于检查其参数是否是非数字值（isNaN() 函数）

console.log(isNaN(10));     // false
console.log(isNaN(""));     // false
console.log(isNaN(true));   // false