js基础学习

1.js是什么？

js是运行在客户端的脚本语言,无需编译，由js解释器解释执行，也可以基于Node.js技术进行服务器端编程。
能够表端验证，网页特效，服务器开发，桌面程序，App，控制硬件，游戏开发。
2.执行流程
渲染引擎(HTML)，JS引擎(js解释器)
3.js组成
ECMAScript（javascript语法），DOM（页面文档对象模型），浏览器对象模型（BOM）
4.js初体验
行内式js<body>标签内，内嵌式js<head>标签式，外部js文件

行内式

内嵌式+js文件

注意事项：

js大部分使用单引号。
外部js引入标签内部不许写内容

js输入输出

alert（msg）
console.log（msg）
prompt（info）输入框
变量声明
var
let
const
特点：变量值覆盖，声明多个变量（逗号隔开），特殊值：undefined，tel is not defined:引用错误
命名规范：驼峰命名法，
简单应用：接收用户的输入，然后输出：

代码

数字变量：

        var PI = 3.14 // PI 数字型
            // 1. 八进制  0 ~ 7  我们程序里面数字前面加0 表示八进制,010  八进制 转换为 10进制 就是  8
        var num1 = 010;
        console.log(num1); 

        // 2. 十六进制  0 ~ 9  a ~ f    #ffffff  数字的前面加 0x 表示十六进制
        var num3 = 0x9;
        console.log(num3);
     
        // 3. 数字型的最大值
        console.log(Number.MAX_VALUE);
        // 4. 数字型的最小值
        console.log(Number.MIN_VALUE);
        // 5. 无穷大
        console.log(Number.MAX_VALUE * 2); // Infinity 无穷大  
        // 6. 无穷小
        console.log(-Number.MAX_VALUE * 2); // -Infinity 无穷大
        // 7. 非数字
        console.log('pink老师' - 100); // NaN

isNaN()方法

        console.log(isNaN(12)); // false
        console.log(isNaN('pink老师')); // true

弹出警示框案例

alert('酷热难耐，火辣的太阳底下)

字符串操作

 var str = 'my name is andy';
        console.log(str.length); // 15
        // 2. 字符串的拼接 +  只要有字符串和其他类型相拼接 最终的结果是字符串类型
        console.log('沙漠' + '骆驼'); // 字符串的 沙漠骆驼
        console.log('pink老师' + 18); // 'pink老师18'
        console.log('pink' + true); // pinktrue
        console.log(12 + 12); // 24
        console.log('12' + 12); // '1212'

boolen,null类型：这两个都在数值上有反映。

    var flag = true; // flag 布尔型 
        var flag1 = false; // flag1 布尔型
        console.log(flag + 1); // true 参与加法运算当1来看
        console.log(flag1 + 1); // false 参与加法运算当 0来看
// null 空值
        var space = null;
        console.log(space + 'pink'); // nullpink
        console.log(space + 1); // 1

typeof关键字：prompt 取过来的值是字符型的，有如下类型number，string，boolean，undefined，object。
类型转换：

转换为字符串：变量.toString()，String(num)，使用+隐式转换
转换为数字型：

// 1. parseInt(变量)  可以把 字符型的转换为数字型 得到是整数       
// 2. parseFloat(变量) 可以把 字符型的转换为数字型 得到是小数 浮点数
// 3. 利用 Number(变量)
// 4. 利用了算数运算 -  *  /  隐式转换

运算方面都普通简单罗列一下要点：

我们不能直接拿着浮点数来进行相比较是否相等

变量的定义域

1. 全局变量：在全局作用域下的变量在全局下都可以使用
  // 注意如果在函数内部没有声明直接赋值的变量也属于全局变量
// 2. 局部变量在局部作用域下的变量后者在函数内部的变量就是局部变量
// 注意：函数的形参也可以看做是局部变量

作用域链：内部函数访问外部函数的变量，采取的是链式查找的方式来决定取那个值这种结构我们称为作用域链就近原则
js预编译：

我们js引擎运行js 分为两步：预解析代码执行
// (1). 预解析 js引擎会把js 里面所有的 var 还有 function 提升到当前作用域的最前面
// (2). 代码执行按照代码书写的顺序从上往下执行
预解析分为变量预解析（变量提升）和函数预解析（函数提升）
// (1) 变量提升就是把所有的变量声明提升到当前的作用域最前面不提升赋值操作
// (2) 函数提升就是把所有的函数声明提升到当前作用域的最前面不调用函数
对象创建：

//两种创建对象的方式一次只能创建一个对象
var obj = {
                uname: '张三疯',
                age: 18,
                sex: '男',
                sayHi: function() {
                    console.log('hi~');
                }
            }
 // 利用 new Object 创建对象
        var obj = new Object(); // 创建了一个空的对象
        obj.uname = '张三疯';
        obj.age = 18;
        obj.sex = '男';
        obj.sayHi = function() {
                console.log('hi~');

            }
//构造函数
// new 构造函数名();
        function Star(uname, age, sex) {
            this.name = uname;
            this.age = age;
            this.sex = sex;
            this.sing = function(sang) {
                console.log(sang);

            }
        }
        var ldh = new Star('刘德华', 18, '男'); // 调用函数返回的是一个对象

new关键字执行过程
1. new 构造函数可以在内存中创建了一个空的对象
2. this 就会指向刚才创建的空对象
3. 执行构造函数里面的代码给这个空对象添加属性和方法
4. 返回这个对象

对象遍历

 for (var k in obj) {
            console.log(k); // k 变量 输出  得到的是 属性名
            console.log(obj[k]); // obj[k] 得到是 属性值

        }

Math数学对象不是一个构造函数，所以我们不需要new 来调用而是直接使用里面的属性和方法即可

        console.log(Math.PI); // 一个属性 圆周率
        console.log(Math.max(1, 99, 3)); // 99
        console.log(Math.max(-1, -10)); // -1
        console.log(Math.max(1, 99, 'pink老师')); // NaN
        console.log(Math.max()); // -Infinity
 // 1.绝对值方法
        console.log(Math.abs(1)); // 1
        console.log(Math.abs(-1)); // 1
        console.log(Math.abs('-1')); // 隐式转换 会把字符串型 -1 转换为数字型
        console.log(Math.abs('pink')); // 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
// 1.Math对象随机数方法   random() 返回一个随机的小数  0 =< x < 1
        // 2. 这个方法里面不跟参数
        // 3. 代码验证 
        console.log(Math.random());
        // 4. 我们想要得到两个数之间的随机整数 并且 包含这2个整数
        // Math.floor(Math.random() * (max - min + 1)) + min;