zoukankan      html  css  js  c++  java
  • javaScript基础

    javascript :

    --脚本语言, 插入 HTML 页面后,可由所有的现代浏览器执行。

    引入方式:

    #引入方式 : 
    1.script标签内部直接书写
    <script>
    alert(123)
    </script>
    zgu
    2.通过script标签src书写 引入外部js文件
    <script src="js.js"></script>
    
    
    注释 : 
    	// 单行注释
        /*
        多行注释1
        多行注释2
        	*/
            
    注意: 
    	1.javaScript中的语句要以分号(;)为结束符。
    

    javaScript 语言基础:

    -- javaScript 中的所有事物都是对象

    数据类型:

    #变量 :
    	var 变量声明 全局
        let 变量声明 所声明的变量只在let命令所在的代码块内有效。
        const 常量(不变)
        
    #数字类型(number): 
    		int / float
        	NaN,表示不是一个数字(Not a Number)。
            
    # 字符串(string) : / str
    		console.log() --> print()
        #拼接字符串一般使用“+”
        
    #模板字符串(template string)是增强版的字符串,用反引号(`)标识。
    	它可以当做普通字符串使用,也可以用来定义多行字符串,或者在字符串中嵌入变量。
    
    #布尔值 (boolean) :
    	true / false (小写)
        ""(空字符串)、0、null、undefined、NaN都是false。
        
    #数组: 列表(类似)
    	forEach(function(currentValue, index, arr), thisValue)
        currentValue	必需。当前元素
        index	可选。当前元素的索引值。
        arr	可选。当前元素所属的数组对象。
    
       
    #对象 : object --> 对象(字典) 
        
    #数据类型(Symbol
    
    #ES6新引入了一种新的原始数据类型(Symbol),表示独一无二的值。它是JavaScript语言的第7种数据类型
    
    #自定义对象 :
    对象(Object)本质上是键值对的集合(Hash结构),但是只能用字符串作为键
    
    #striing 常用方法 :
    .length	返回长度
    .trim()	移除空白
    .trimLeft()	移除左边的空白
    .trimRight()	移除右边的空白
    .charAt(n)	返回第n个字符
    .concat(value, ...)	拼接
    .indexOf(substring, start)	子序列位置
    .substring(from, to)	根据索引获取子序列
    .slice(start, end)	切片
    .toLowerCase()	小写
    .toUpperCase()	大写
    .split(delimiter, limit)	分割
    
    #null 和 undefined 区别:
    	null表示值是空,一般在需要指定或清空一个变量时才会使用,如 name=null;
        
    	undefined表示当声明一个变量但未初始化时,该变量的默认值是undefined。还有就是函数无明确的返回值时,返回的也是undefined。
    
    #数组的常用方法:
    .length	数组的大小
    .push(ele)	尾部追加元素
    .pop()	获取尾部的元素
    .unshift(ele)	头部插入元素
    .shift()	头部移除元素
    .slice(start, end)	切片
    .reverse()	反转
    .join(seq)	将数组元素连接成字符串
    .concat(val, ...)	连接数组
    .sort()	排序
    .forEach()	将数组的每个元素传递给回调函数
    .splice()	删除元素,并向数组添加新元素。
    .map()	返回一个数组元素调用函数处理后的值的新数组
    

    运算符

    #运算符
    
     #1.算术运算符:
        + - * / % ++ --
        var x=10;
        var res1=x++;   # 先赋值,在自增
        var res2=++x;	#先自增,在赋值
    	
     #2.比较运算符:
    	> >= < <= != == === !==
    	
        # 数据类型不同是比较大小: 
        1 == “1”  // true  弱等于
        1 === "1"  // false 强等于
        //上面这张情况出现的原因在于JS是一门弱类型语言(会自动转换数据类型),所以当你用两个等号进行比较时,JS内部会自动先将
        //数值类型的1转换成字符串类型的1再进行比较,所以我们以后写JS涉及到比较时尽量用三等号来强制限制类型,防止判断错误	
        
     #3.逻辑运算符:
    	&&    and
        ||     or
    	!	  not
        
     #4.赋值运算符:
    	= += -= *= /=
    

    流程控制

    #流程控制
     
    	#if ..else.
    
    	#if..else if ..else
                var a = 10;
            if (a > 5){
              console.log("a > 5");
            }else if (a < 5) {
              console.log("a < 5");
            }else {
              console.log("a = 5");
            }
        
        #switch:
            var day = new Date().getDay();
            switch (day) {
              case 0:
              console.log("Sunday");
              break;
              case 1:
              console.log("Monday");
              break;
            default:
              console.log("...")
            }
        # case子句通常都会加break语句,否则程序会继续执行后续case中的语句。
        #for
    	for (var i=0;i<10;i++) {
            console.log(i);
        }
    
    	#while:
        var i = 0;
        while (i < 10) {
          console.log(i);
          i++;
        }
        
        #三元运算
        	var c = a > b ? a : b
    //这里的三元运算顺序是先写判断条件a>b再写条件成立返回的值为a,条件不成立返回的值为b;三元运算可以嵌套使用;
    

    函数

    #函数:
    
    // 普通函数定义
    function f1() {
      console.log("Hello world!");
    }
    
    // 带参数的函数
    function f2(a, b) {
      console.log(arguments);  // 内置的arguments对象: 接受所有参数(列表)
      console.log(arguments.length);
      console.log(a, b);
    }
    
    // 带返回值的函数
    function sum(a, b){
      return a + b;
    }
    sum(1, 2);  // 调用函数
    
    // 匿名函数方式
    var sum = function(a, b){
      return a + b;
    }
    sum(1, 2);
    
    // 立即执行函数 书写立即执行的函数,首先先写两个括号()()这样防止书写混乱
    (function(a, b){
      return a + b;
    })(1, 2);
    
    ES6中允许使用“箭头”(=>)定义函数。
    
    var f = v => v;
    // 等同于
    var f = function(v){
      return v;
    }
    如果箭头函数不需要参数或需要多个参数,就是用圆括号代表参数部分:
    
    var f = () => 5;
    // 等同于
    注意:
    
    函数只能返回一个值,如果要返回多个值,只能将其放在数组或对象中返回。
    

    函数作用域:

    #函数的全局变量和局部变量
    
    局部变量:
    
    在JavaScript函数内部声明的变量(使用 var)是局部变量,所以只能在函数内部访问它(该变量的作用域是函数内部)。只要函数运行完毕,本地变量就会被删除。
    
    全局变量:
    
    在函数外声明的变量是全局变量,网页上的所有脚本和函数都能访问它。
    
    变量生存周期:
    
    JavaScript变量的生命期从它们被声明的时间开始。
    
    局部变量会在函数运行以后被删除。
    
    全局变量会在页面关闭后被删除。
    
    作用域
    首先在函数内部查找变量,找不到则到外层函数查找,逐步找到最外层
    
    var city = "BeiJing";
    function Bar() {
      console.log(city);
    }
    function f() {
      var city = "ShangHai";
      return Bar;
    }
    var ret = f();
    ret();  // 打印结果是? --》 BeiJing(局部不能作用到全局)
    

    词法分析:

    #词法分析:
    
    JavaScript中在调用函数的那一瞬间,会先进行词法分析。
    
    词法分析的过程:
    
    当函数调用的前一瞬间,会先形成一个激活对象:Avtive Object(AO),并会分析以下3个方面:
    
    1:函数参数,如果有,则将此参数赋值给AO,且值为undefined。如果没有,则不做任何操作。
    2:函数局部变量,如果AO上有同名的值,则不做任何操作。如果没有,则将此变量赋值给AO,并且值为undefined。
    3:函数声明,如果AO上有,则会将AO上的对象覆盖。如果没有,则不做任何操作。
    
    函数内部无论是使用参数还是使用局部变量都到AO上找。
    

    自定义对象:

    #自定义对象: 
    
    创建对象:
    
    var person=new Object();  // 创建一个person对象
    person.name="Alex";  // person对象的name属性
    person.age=18;  // person对象的age属性
    
    遍历对象中的内容
    var a = {"name": "Alex", "age": 18};
    for (var i in a){
      console.log(i, a[i]);
    }
    Object结构提供了“字符串--值”的对应,Map结构提供了“值--值”的对应,是一种更完善的Hash结构实现
    
    // 父类构造函数
    var Car = function (loc) {
      this.loc = loc;
    };
    
    // 父类方法
    Car.prototype.move = function () {
      this.loc ++;
    };
    
    // 子类构造函数
    var Van = function (loc) {
      Car.call(this, loc);
    };
    
    // 继承父类的方法
    Van.prototype = Object.create(Car.prototype);
    // 修复 constructor
    Van.prototype.constructor = Van;
    // 扩展方法
    Van.prototype.grab = function () {
      /* ... */
    };
    
    JavaScript面向对象之继承
    

    date对象

    #date对象 :
    
    #创建date对象:
    //方法1:不指定参数
    var d1 = new Date();
    console.log(d1.toLocaleString()); !!!
    //方法2:参数为日期字符串
    var d2 = new Date("2004/3/20 11:12");
    console.log(d2.toLocaleString()); 
    var d3 = new Date("04/03/20 11:12");
    console.log(d3.toLocaleString());
    //方法3:参数为毫秒数
    var d3 = new Date(5000);
    console.log(d3.toLocaleString());
    console.log(d3.toUTCString());
    
    //方法4:参数为年月日小时分钟秒毫秒
    var d4 = new Date(2004,2,20,11,12,0,300);
    console.log(d4.toLocaleString());  //毫秒并不直接显示
    
    var d = new Date(); 
    //getDate()                 获取日
    //getDay ()                 获取星期
    //getMonth ()               获取月(0-11)
    //getFullYear ()            获取完整年份
    //getYear ()                获取年
    //getHours ()               获取小时
    //getMinutes ()             获取分钟
    //getSeconds ()             获取秒
    //getMilliseconds ()        获取毫秒
    //getTime ()                返回累计毫秒数(从1970/1/1午夜)
    

    JSON对象

    #JSON对象:
    
    // JSON字符串转换成对象
    var obj = JSON.parse(str1);   --》 JSON.loads
    // 对象转换成JSON字符串
    var str = JSON.stringify(obj1);  -->JSON.dumps
    

    REGExp 对象(re正则)

    #REGExp 对象(re正则)
    
    // 定义正则表达式两种方式
    var reg1 = new RegExp("^[a-zA-Z][a-zA-Z0-9]{5,11}");
    var reg2 = /^[a-zA-Z][a-zA-Z0-9]{5,9}$/; + g (搜索全局)
    
    // 正则校验数据
    reg1.test('jason666')
    reg2.test('jason666')
    
    /*第一个注意事项,正则表达式中不能有空格*/ 
    
    // 全局匹配
    var s1 = 'egondsb dsb dsb';
    s1.match(/s/)
    s1.match(/s/g)
    
    reg2.test('egondsb');
    reg2.lastIndex;
    /*第二个注意事项,全局匹配时有一个lastIndex属性*/
    
    lastIndex属性: 匹配到则index = 尾号索引,没有找到则为 '0'
    

    math对象

    # math对象:
    
    abs(x)      返回数的绝对值。
    exp(x)      返回 e 的指数。
    floor(x)    对数进行下舍入。
    log(x)      返回数的自然对数(底为e)。
    max(x,y)    返回 x 和 y 中的最高值。
    min(x,y)    返回 x 和 y 中的最低值。
    pow(x,y)    返回 x 的 y 次幂。
    random()    返回 0 ~ 1 之间的随机数。
    round(x)    把数四舍五入为最接近的整数。
    sin(x)      返回数的正弦。
    sqrt(x)     返回数的平方根。
    tan(x)      返回角的正切。
    
  • 相关阅读:
    [MySQL] 日志文件概述
    ASP.NET session expired simple solution
    Sailfish应用开发入门(一)ApplicationWindow与Cover
    linux下QT4的使用
    js控制图片定时切换不限制数量
    C++ 从零单排(3)
    wordcraft(陈高远)
    苦逼翻滚之实习找工记事产品岗(3.184.23长文慎入)
    【Oracle导入导出】expdp
    【leetcode】Minimum Depth of Binary Tree
  • 原文地址:https://www.cnblogs.com/shaozheng/p/11869114.html
Copyright © 2011-2022 走看看