Javascript基本语法

JavaScript5.0

JS的引入方式

  • 内接式

    <script type="text/javascript">
	...
</script>

  • 外接式

    <!--相当于引入了某个模块-->
<script type="text/javascript" src = './index.js'></script>

变量

  • 变量的声明

    var a = 100;

  • 变量的命名规范
    变量名有命名规范：只能由英语字母、数字、下划线、美元符号$构成，且不能以数字开头，并且不能是JavaScript保留字。

    保留字:
bstract、boolean、byte、char、class、const、debugger、double、enum、export、extends、final、float、goto
implements、import、int、interface、long、native、package、private、protected、public、short、static、super、synchronized、throws、transient、volatile

  • 基本数据类型

    • 数值类型：number

      var a = 100;            //定义了一个变量a，并且赋值100
 console.log(typeof a);  //输出a变量的类型 使用typeof函数 检测变量a的数据类型

//特殊情况
var b = 5/0;
console.log(b); //Infinity 无限大
console.log(typeof b); //number 类型

    • 字符串类型：string

      var a = "abcde";
var b = "哈哈哈哈哈";
var c = "123123";
var d =  "";     //空字符串

      键盘上的+可能是连字符，也可能是数字的加号

      console.log("我" + "爱" + "你");   //连字符，把三个独立的汉字，连接在一起了
console.log("我+爱+你");           //原样输出
console.log(1+2+3);             //输出6

    • 布尔类型：boolean

      var isShow = false;
console.log(typeof b1);

    • 空对象：null

      var c1 = null;//空对象. object
console.log(typeof c1);

    • 未定义：undefined

      var d1;
//表示变量未定义
console.log(typeof d1);

  • 复杂数据类型

    • 数组Array

      var colors = ['red','green','yellow'];

        var colors = new Array();
  //通过下标进行赋值
  colors[0] = 'red';
  colors[1] = 'green';
  colors[2] = 'yellow';
  console.log(colors);

      数组的常用方法
      img

      • concat() 数组的合并

        var north = ['北京','山东','天津'];
var south = ['东莞','深圳','上海'];

var newCity = north.concat(south);
console.log(newCity)

      • join() 将数组中元素使用指定字符串连接起来

        var score = [98,78,76,100,0];
var str = score.join('|');
console.log(str);//"98|78|76|100|0"

      • slice(start,end) 返回数组的一段记录，顾头不顾尾

        var arr = ['张三','李四','王文','赵六'];
var newArr  = arr.slice(1,3);
console.log(newArr);//["李四", "王文"]

      • pop() 移除数组的最后一个元素

        var arr = ['张三','李四','王文','赵六'];
arr.pop();
console.log(arr);//["张三", "李四"，"王文"]

      • push() 向数组最后添加一个元素

        var arr = ['张三','李四','王文','赵六'];
arr.push('q1ang');
console.log(arr);//["张三", "李四"，"王文"，"赵六"，"q1ang"]

      • reverse() 翻转数组

        var names = ['张三','李四','王文','赵六'];
//反转数组
names.reverse();
console.log(names);

      • sort() 对数组排序

        var names = ['b','c','a','e'];
names.sort();
console.log(names)；// ["a", "b", "c", "e"]

      • 判断是否为数组：isArray()

        布尔类型值 = Array.isArray(被检测的值) ;

    • 字符串 string
      img

      • chartAt() 返回指定索引的位置的字符
      var str = 'q1ang';
var charset = str.charAt(1);
console.log(charset);//1
      • concat() 返回字符串值，表示两个或多个字符串的拼接
      var str1 = 'q1';
var str2  = 'ang';
console.log(str1.concat(str2,str2));//q1ang
      • replace(a,b) 将字符串a替换成字符串b
      var a = '1234567755';
var newStr = a.replace("4567","****");
console.log(newStr);//123****755
      • indexof() 查找字符的下标，如果找到返回字符串的下标，找不到则返回-1 。跟seach()方法用法一样
      var str = 'q1ang';
console.log(str.indexOf('q'));//0
console.log(str.indexOf('z'));//-1
      • slice(start，end) 左闭右开 分割字符串
      var str = 'q1ang';
console.log(str.slice(1,2));//1
      • split('a',1) 以字符串a分割字符串，并返回新的数组。如果第二个参数没写，表示返回整个数组，如果定义了个数，则返回数组的最大长度
      var  str =  '我的天呢,a是嘛,你在说什么呢?a哈哈哈';
console.log(str.split('a'));//["我的天呢,", "是嘛,你在说什么呢?", "哈哈哈"]
      • substr(statr,end) 左闭右开
      var  str =  '我的天呢,a是嘛,你在说什么呢?a哈哈哈';
console.log(str.substr(0,4));//我的天呢
      • toLowerCase()转小写
      var str = 'Q1ANG';
console.log(str.toLowerCase())；//q1ang
      • toUpperCase()转大写
      var str = 'q1ang';
console.log(str.toUpperCase());//Q1ANG

      特别：

      //1.将number类型转换成字符串类型
var num = 132.32522;
var numStr = num.toString()
console.log(typeof numStr)
//四舍五入
var newNum = num.toFixed(2)
console.log(newNum)

  • 运算符

    • 赋值运算符以
      var x = 12,y=5来演示示例

      img

    • 算术运算符
      var a = 5,b=2;

      img

    • 比较运算符
      var x = 5;

      img

  • 数据类型转换

    • 将number类型转换成string类型
      隐式转换

      var n1 = 123;
var n2 = '123';
var n3 = n1+n2;
// 隐式转换
console.log(typeof n3);
      强制转换
      // 强制类型转换String(),toString()
var str1 = String(n1);
console.log(typeof str1);

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

    • 将string类型转换成number类型

      var  stringNum = '789.123wadjhkd';
var num2 =  Number(stringNum);
console.log(num2); //NaN  Not a Number 但是一个number类型

// parseInt()可以解析一个字符串 并且返回一个整数
console.log(parseInt(stringNum))； //789
console.log(parseFloat(stringNum)); //789.123

    • 任何的数据类型都可以转换为boolean类型

      var b1 = '123'; //true
var b2 = 0; //false
var b3 = -123 //true
var b4 = Infinity; //true
var b5 = NaN; //false
var b6; //false
var b7 = null; //false
//使用Boolean(变量) 来查看当前变量的真假

流程控制

  • if

    var age = 20;
if(age>18){
    //{}相当于作用域
    console.log('成年人');
}
alert('q1ang'); //下面的代码照样执行

  • if - else

    var age = 20;
if(age>18){
    //{}相当于作用域
    console.log('成年人');
}else{
    console.log('未成年');
}
alert('q1ang'); //下面的代码照样执行

  • if - else if - else

    var age = 18;
if(age==18){
    //{}相当于作用域
    console.log('18岁');
}else if(age==30){
    console.log('成年人');
}else{
    console.log('。。。')
}
alert('q1ang'); //下面的代码照样执行

  • 逻辑与&&、逻辑或||

    //1.模拟  如果总分 >400 并且数学成绩 >89分 被清华大学录入
//逻辑与&& 两个条件都成立的时候 才成立
if(sum>400 && math>90){
    console.log('清华大学录入成功')
}else{
    alert('高考失利')
}
//2.模拟 如果总分>400 或者你英语大于85 被复旦大学录入
//逻辑或  只有有一个条件成立的时候 才成立
if(sum>500 || english>85){
    alert('被复旦大学录入')
}else{
    alert('高考又失利了')
}

  • switch 语句

    var gameScore = 'better';

switch(gameScore){

//case表示一个条件 满足这个条件就会走进来 遇到break跳出。break终止循环。如果某个条件中不写 break，那么直到该程序遇到下一个break停止
    case 'good':
    console.log('玩的很好')
    //break表示退出
    break;
    case  'better':
    console.log('玩的老牛逼了')
    break;
    case 'best':
    console.log('恭喜你 吃鸡成功')
    break;

    default:
    console.log('很遗憾')
}
//注意：switch相当于if语句 但是玩switch的小心case穿透

  • while 循环

    1.初始化循环变量；2.判断循环条件；3.更新循环变量

    // 例子：打印 1~9之间的数
var i = 1; //初始化循环变量

while(i<=9){ //判断循环条件
    console.log(i);
    i = i+1; //更新循环条件
}

  • do - while 循环

    //不管有没有满足while中的条件do里面的代码都会走一次
var i = 3;//初始化循环变量
do{

    console.log(i)
    i++;//更新循环条件

}while (i<10) //判断循环条件

  • for 循环

    //输出1~10之间的数
for(var i = 1;i<=10;i++){
     console.log(i)
 }

Math内置对象

img

  • Math.ceil() 向上取整，'天花板函数'
var x = 1.234;
//天花板函数  表示大于等于 x，并且与它最接近的整数是2
var a = Math.ceil(x);
console.log(a);//2
  • Math.floor 向下取整，'地板函数'
var x = 1.234;
// 小于等于 x，并且与它最接近的整数 1
var b = Math.floor(x);
console.log(b);//1
  • 求两个数的最大值和最小值
//求 两个数的最大值 最小值
console.log(Math.max(2,5));//5
console.log(Math.min(2,5));//2
  • 随机数 Math.random()
var ran = Math.random();
console.log(ran);[0,1)

如果让你取100-200之间的随机数，怎么做？

背过公式：min - max之间的随机数： min+Math.random()*(max-min);

函数

  • 解决大量的重复性的语句
  • 简化编程，让编程模块化
# python 中声明函数
def add(x,y):
    return x+y

# 调用函数
print(add(1,2))
//js中声明函数
function add(x,y){
    return x+y;
}
//js中调用函数
console.log(add(1,2));

解释如下：

  • function：是一个关键字。中文是“函数”、“功能”。

  • 函数名字：命名规定和变量的命名规定一样。只能是字母、数字、下划线、美元符号，不能以数字开头。

  • 参数：后面有一对小括号，里面是放参数用的。

  • 大括号里面，是这个函数的语句。

  • 伪数组 arguments

    • arguments只在函数中使用。
        fn(2,4);
    fn(2,4,6);
    fn(2,4,6,8);

    function fn(a,b,c) {
        console.log(arguments);
        console.log(fn.length);         //获取形参的个数
        console.log(arguments.length);  //获取实参的个数

        console.log("----------------");
    }

    • arguments可以修改元素，但不能改变数组的长短

          fn(2,4);
    fn(2,4,6);
    fn(2,4,6,8);

    function fn(a,b) {
        arguments[0] = 99;  //将实参的第一个数改为99
        arguments.push(8);  //此方法不通过，因为无法增加元素
    }

      清空数组的几种方式：

         var array = [1,2,3,4,5,6];
    array.splice(0);      //方式1：删除数组中所有项目
    array.length = 0;     //方式2：length属性可以赋值，在其它语言中length是只读
    array = [];           //方式3：推荐

对象 Object

  1. 使用Object或对象字面量创建对象

  2. 工厂模式创建对象

  3. 构造函数模式创建对象

  4. 原型模式创建对象

Date日期对象

//创建了一个date对象
var myDate = new Date();

img

//返回本地时间
console.log(myDate().toLocalString());

JSON

  • JSON字符串转换JSON对象

    var jsonObject= jQuery.parseJSON(jsonstr);

  • JSON对象转化JSON字符串

    var jsonstr =JSON.stringify(jsonObject);
posted @ 2018-10-10 21:36  q1ang  阅读(169)  评论(0)  编辑  收藏  举报