js的一些基本用法

kdemo01：
接口使用 interface 关键字声明
单步调试F10

<!--外部式js写法-->
<script src = "../my.js"></script>

变量：
var num 声明变量 //js的变量数据类型是只有程序在运行过程中，根据等号右边的值来确定的
js是动态语言，变量的数据类型是可以变化的
在js中八进制前面加0，16进制前面加0x
数字型的最大值：console.log（Number.MAX_VALUE）
最小值：console.log（Number.MIN_VALUE）
Infinity:无穷大
-Infinity:无穷小
NaN ： 非数值

isNaN（）这个方法用来判断非数字，是数字返回的是false，不是数字返回true；
Console.log(isNan(12)); //false

字符串转义字符：都是用\开头 但是这些转义字符写道引号里面
var str = “我是一个’高富帅’的\n程序员”
Console.log（str）
\ 斜杠\ ’ 单引号 ‘’ 双引号 \t tab缩进 \b 空格
字符串拼接：
字符串 + 如何类型 = 拼接之后的新字符串
boolean：
var flag = true // 结果是1 true代表1false代表0
undefined 未定义数据类型
undefined 和数字相加 最后的结果是 NaN
数据类型检测：
Console.log(typeof num); // typeof 数据类型检测
数据类型转换：转换为字符串： 3种写法
tostring（）var num=1；alert(num.tostring());
String() varnum = 1;alert(String(num));
加号拼接字符串: var num = 1;alert(nmum + “我是字符串”)
字符型转整形函数：
parseInt(string) 讲string类型转成整数数值型
parseFloat(string) 将string类型转成浮点型数值型
转换为布尔型：
Console.log(Boolean(’’)) 代表空、否定的值为false，如’’，0，NaN、null、undefined
比较运算符：
==：默认转换数据类型 会把字符串型的数据转换为数字型的
console.og(18 == ‘18’) 返回true
===:全等的意思 ！==全不等
逻辑&& 短路运算 如果表达式1为真 则返回表达式2
Console.log(34 && 20) 返回输出 34
逻辑||则相反
优先级：
小括号>一元运算符>算数>关系>相等>逻辑>赋值>逗号

demo02：
三元运算符：
条件表达式 ？ 表达式1 ： 表达式2
如果条件表达式结果为真 则 返回 表达式1的值 如果条件表达式结果为假 则返回 表达式2的值
num>10 : ‘大于’ ：‘小于’

js断点：
打开浏览器，f12点开Sources，语句左侧单击，刷新浏览器，，F11单步执行，watch观察变量

for循环：
用追加字符串的方式打印不会换行的效果
var str = ‘’
for(var i =0;i<=5;i++){
str = str + ‘’
}
双重循环：
外层循环一次，内存循环全部
九九乘法表代码：
var str = ‘’
for(var i = 1;i<=9;i++){
for(var j = 1;j<=i;j++){
str += j +’’ + i +’=’ + i * j +’\t’
}
str = str +’\n’
}
console.log(str)
数组：
var array = [里面可以放任意的数据类型
数组转换为分割字符串：
追加数组元素：
var arr = [‘red’.‘green’,‘blue’]
arr[3] = ‘pink’
console.log(arr)

length自动检测元素的变化
//翻转数组
var shuzu = [‘red’,‘green’,‘blue’,‘pink’,‘purple’];
var newshuzu = [];
for(var i = shuzu.length-1;i>=0;i–){
newshuzu[newshuzu.length] = shuzu[i];
}
console.log(newshuzu)
冒泡排序：
var arr = [5,4,3,2,1];
var temp ;
for(var i = 0;i<= arr.length-1;i++){//外层循环管趟数
for(var j = 0;j<arr.length-i-1;j++){//里面的循环管 每一趟交换次数
//内部交换2个 变量的值 前一个和后面一个数组元素相比较
if(arr[j] > arr[j+1]){
temp = arr[j];
arr[j] = arr[j+1];
arr[j+1] = temp;
}

       }
    }
    console.log(arr)

函数：
//什么是函数 函数就是封装了一段可被重复调用执行的代码块，就是让大量代码重复使用
//函数使用：声明函数 和 调用函数
//注意事项：
//（1）声明函数的关键字function，全部小写
// （2）函数是做某件事情，函数名一般是动词
//（3）函数不调用自己不执行
//声明函数
function 函数名(){
//函数体
}
//调用函数
//函数名()；
函数的封装就是把一个或者多个功能通过函数的方式封装起来，对外只提供一个简单的函数接口
函数传参：
// function 函数名(形参1，形参2) { 形参是接收实参的
// }
// 函数名（实参1，实参2）

    function cookeat(aru) {
        console.log(aru)
    }
    cookeat(666)

//实参等于形参个数：输出正确结果
//如果实参的个数多于形参的个数 会取到形参的个数，程序不会报错
// 如果实参的个数多小形参的个数 多于的形参定义为undefind 最终的结果就是NaN

不要再函数的内部写输出语句
function getsum(num1,num2) {
return num1+num2;
}

    console.log(getsum(1,3))


    //利用函数求任意一个数组[5,2,99,101,67,77]中的最大值
    function arrMax(arr) {
            var max = arr[0];
            for(var i = 1;i<arr.length;i++){
                if(arr[i] > max){
                    max = arr[i];
                }
            }
            return max;
    }

var re = arrMax([5,2,99,101,67,77]);
console.log(re)

//函数返回值注意事项
//1.return后面的代码不会被执行
// 2.return只能返回一个值，如果用逗号隔开多个值，以最后一个为准
//3.我们求任意2个数的 加减乘除结果,数组可以返回多个结果
//我们的函数如果有return 则返回的是return 后面的值，如果函数没有return 则返回undefin

    function getresult(num1,num2) {
        return [num1+num2,num1-num2,num1*num2,num1/num2];
    }
    var re = getresult(1,2)//返回的是一个数组
    console.log(re)

//函数：arguments 的使用 只有函数才有arguments对象 而且是每个函数都内置了这个arguments
function fn() {
console.log(arguments);//里面存储了所有传递过来的实参
//我们可以按照数组的方式遍历arguments
for(var i = 0;i<arguments.length;i++){
console.log(arguments[i]);
}
}
fn(1,2,3);
//伪数组 并不是真正意义上额数组
//1.具有数组的length长度
//2.按照索引的方式来进行存储的
//3. 他没有真正数组额一些方法 pop() push() 等等

    //利用函数封装方式，对数组排序--冒泡排序
    function maopao(arr) {
        var temp = 0;
        for(var i = 0;i<arr.length-1;i++){
            for(var j = 0;j<arr.length-i-1;j++){
                if(arr[j] > arr[j+1]){
                    temp = arr[j];
                    arr[j] = arr[j+1];
                    arr[j+1] = temp;
                }
            }
        }
        return arr;
    }

    console.log(maopao([11,44,62,12,42,45,55]))

函数互相调用：
function fn1() {
console.log(123)
fn2();
}
fn1();
function fn2() {
console.log(45)

    }

函数的2种声明方式：
//函数的2种声明方式
//1.利用函数关键字自定义函数（命名函数）
//2.函数表达式（匿名函数）
// var 变量名 = function () {};

作用域：
//1.作用域：就是代码名字（变量）在某个范围内起作用和效果
// 目的是为了提高程序的可靠性更重要的是减少命名冲突
//2.js的作用域（es6）es6是一个版本:全局作用域 局部作用域
//3.全局作用域：整个script标签 或者是一个单独的js文件
//4.局部作用域 （函数作用域） 在函数内部就是局部作用域 这个代码的名字旨在函数内部起效果和作用
function fn() {

        //局部作用域
    }

// 作用域链 :内部函数访问外部函数的变量，采取的是链式查找的方式来取决取那个值 这种结构我们称为作用域链
var num = 10;
function fn() {
var num = 20;
function fun() {
console.log(num)
}
fun();
}
fn();
预解析：
//1.我们js引擎运行js 分为2步 ： 先看预解析再看代码执行
//(1)预解析 ： js引擎会把js 里面所有的var 还有 function 提升到当前作用域的最前面
//(2)代码执行 按照代码书写的顺序从上往下执行
//2.预解析分为 变量预解析（变量提升） 和 函数解析 （函数提升）

js对象：对象是一组无序的相关属性的方法的集合，对象是由属性和方法组成的，无序就是没有索引号的没有顺序的，比如说手机，可以把手机看为一个对象，属性（名词）可以看为有颜色有屏幕，方法（动词）可以看为打电话

创建对象：
//利用对象字面量创建对象{}
// var obj = {}; // 创建了一个空对象
var obj = {
uname : ‘张三疯’,
age : 18,
sex : ‘男’,
sayHi: function () {
console.log(‘hi~’)
}
}
//(1) 里面的属性或者方法我们采取键值对的形式 建 属性名： 值 属性值
//（2） 多个属性或者方法中间用逗号隔开的
//（3） 方法冒号后面跟的是一个匿名函数
//2.使用对象
//(1)调用对象的属性 我们采取 对象名.属性名
console.log(obj.uname)
//(2) 调用属性还有一种方法 对象名[‘属性名’]
console.log(obj[‘age’]);
//(3) 调用对象的方法 sayHi 对象名.方法名（）
obj.sayHi();
//利用 new Object 创建对象
var obj = new Object();//创建了一个空的对象
obj.uname = ‘张三丰’
obj.age = 18
obj.sex = ‘男’
obj.sayHi = function () {
console.log(‘Hi~’)
}
//(1) 我们是利用 等号 = 赋值的方法 添加对象的属性和方法
//（2） 每个属性方法之间用 分号结束
console.log(obj.uname)
console.log(obj[‘sex’])
obj.sayHi()

//利用构造函数创建对象
//因为我们一次创建一个对象，里面很多的属性和方法是大量相同的 我们只能复制
//因此我们可以利用函数的方法，重复这些相同的代码 我们就把这个函数称为 构造函数
//又因为这个函数不一样，里面封装的不是普通代码，而是对象
//构造函数 就是把我们对象里面一些相同的属性和方法抽象出来封装到函数里面

    //创建四大天王的对象 都有相同的属性:名字 年龄 性别 相同的方法：唱歌
    //构造函数的语法格式
    // function 构造函数名() {
    //     this.属性 = 值;
    //     this.方法 = function () {}
    // }
    // new 构造函数名();
    function  Star(uname,age,sex) {
        this.name = uname;
        this.age = age;
        this.sex = sex;
    }
var ldh = new Star('刘德华',18,'男');//调用函数返回的是一个对象 object类型
    //console.log(typeof  ldf);//typeof 是用来检测数据类型的
    console.log(ldh.name)
    console.log(ldh['sex'])
    //1.构造函数的名字首字母要大写
    //2.我们构造函数不需要return 就可以返回结果
    //3.我们调用构造函数 必须使用 new
    //4.我们只要new Star() 调用函数就创建了一个对象 ldh{}
//new关键字执行过程
    //1.new 构造函数可以在内存中创建了一个空的对象
    //2.this就会指向刚才创建的空对象
    //3.执行构造函数里面的代码 给这个空对象添加属性和方法
    //4.返回这个对象 （所以构造函数里面不需要return）

//遍历对象
var obj= {
name: ‘pink老师’,
age : 18,
sex : ‘男’
}
//for in 遍历我们的对象
//for(变量 in 对象){
//
// }
for(var k in obj){
console.log(k)//输出的变量 得到的是属性名
console.log(obj[k])//obj[k]得到的是里面的属性值
}
//我们使用for in 里面的变量 我们喜欢写 k 或者 key

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

    //2.查文档
    //MDN查文档地址：https://developer.mozilla.org/zh-CN/
    //如何学习对象中的方法
   /* 1.查阅该方法的功能
    2.查看里面参数的意义和类型
    3.查看返回值的意义和类型
    4.通过demo进行测试*/

    //3.Math对象
    //Math数学对象，不是一个构造函数，所以我们不需要new 来调用 而是直接使用里面的属性和方法即可
    console.log(Math.PI); //一个属性 圆周率
    console.log(Math.max(12,23,44)) //求最大值
    console.log(Math.max(12,33,'曾庆天'))//NAN
    console.log(Math.max()) //-InFinity 负的无穷大

    //利用对象封装自己的数学对象 里面有 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);
    console.log(myMath.max(1,5,9))
    console.log(myMath.min(1,3,5))
    //这里我们可以看到arguments对象将我传入的五个参数以数组的形式保存在里面，还有保存了我传入函数的实参的个数（length）。而且我们可以看到arguments对象的 ==_ proto _== 是指向object的，这也说明了他是个类数组对象，而不是一个数组。
    //有了这个对象我们以后写函数的时候，就不用给所有的形参指定参数名，然后通过参数名的方式获取参数了，我们可以直接使用arguments对象来获取实参，这样是不是方便了很多呢。


    //绝对值方法
    console.log(Math.abs(1)) //1
    console.log(Math.abs(-1)) //-1
    console.log(Math.abs('-1'))//隐式转换 会把字符串型 -1 转换为数字型
    console.log(Math.abs('曾庆听')) // NAN

    //2.三个取整方法
    //（1） MAth.floor() 向下取整 往最小了取值
    console.log(Math.floor(1.1)) //1
    console.log(Math.floor(7.6))//7
    //（2） MAth.ceil() ceil 天花板 向上取整 往最大了取
    console.log(Math.ceil(1.1)) //2
    console.log(Math.ceil(7.6))//8
    //（3） Math.round() 四舍五入 其他数字都是四舍五入，但是.5特殊 它往大了取
    console.log(Math.round(1.1)) //1
    console.log(Math.round(7.6))//8
    console.log(Math.round(-1.1))//-1
    console.log(Math.round(-1.5))//这个结果是-1，往大了取，-1比-2大，所以他是-1

    //随机数方法 random()
    //取的是浮点型的   random（）返回一个随机的小数 0 =< x <1 包括0小于1
    //2.这个方法里面不跟参数
    //3.代码验证
    console.log(Math.random())
    //4.我们想要得到两个数之间的随机整数 并且 包含这2个整数
    //Math.floor(Math.random() * (max - min +1)) + min;
    function getRandom(max,min) {
        return Math.floor(Math.random() * (max - min +1)) + min;
    }
    console.log(getRandom(10,1))
    //5.随机点名
    var arr = ['曾庆天','曾庆请']
    console.log(arr[getRandom(arr.length-1,0)])

//Date() 日期对象 是一个构造函数 必须使用new 来调用创建我们的日期对象
var arr = new Array(); //创建一个数组对象
//1.使用Date,如果没有参数 返回当前系统的当前时间
var date = new Date();
console.log(date)
//2，参数常用的写法 数字型 2019，10，01 或者是 字符串型 ‘2019-10-1 8:8:8’
var date1 = new Date(2019,10,1)
console.log(date1)//返回的是11月 不是10月
var date2 = new Date(‘2019-10-1 8:8:8’)
console.log(date2)

    //格式化日期 年月日
    var date3 = new Date()
    console.log(date3.getFullYear())//返回当前日期的年
    console.log(date3.getMonth() +1)//月份 返回的月份小一个月 记得月份加1
    console.log(date3.getDate()) // 返回的是 几号
    console.log(date3.getDay()) //周一返回的是1 周六返回的是6 但是 周日返回的是0 因为在老外眼里没有周日所以它返回的是一个0
    //我们写一个 2019年 5月 1日 星期三
    var year = date3.getFullYear();
    var month = date3.getMonth()+1;
    var dates = date3.getDate();
    var arr = ['星期日','星期一','星期二','星期三','星期四','星期五','星期六']
    var day = date3.getDay();
    console.log(year+'年'+month+'月'+dates+'日'+arr[day])