javaScript知识点

输入输出

prompt("请输入您想输入的内容")
alert("弹出对话框")
console.log("控制台输出打印")

变量

声明

  • 只声明不赋值是undefined
  • 不声明不赋值直接报错
  • 直接赋值可以使用(但是会变成全局变量)
var age
var age = 18
var age = prompt("输入您的年龄") //取过来的值是字符串型
var age=18,
	address = "火影春",
	gz = 2000

案例: 交换两个变量的值

//交换两个变量值
var apple1 = 10
var apple = 12
var temp =apple1
apple1 = apple2
apple2 = temp

命名规范

  • 区分大小写 (name是一个关键字)
  • 可以用$符号
  • 遵循驼峰命名法

数据类型

  • js变量数据类型是只有程序运行中,根据右边的值的数据类型进行判断
  • 动态语言,数据类型可以变化
var x = 10//数字型
x = 'ssc'//字符串型

简单数据类型

  1. Number (Infinity无穷大 -Infinity无穷小 NaN非数字)

    isNaN() 是数字返回true 非数字false

  2. Boolean

    参与运算时 true当作1 false当作0

  3. String

    外单内双 或者 内单外双
    转义字符需要加上反斜杠 \n换行 \反斜杠 \t缩进 \b空格
    字符串 + 任何数据类型 = 字符串

  4. Null

    null + 字符串 = 字符串
    null + 数字 = 数字 (当作0来看)

  5. Undefined

    undefined + 字符串 = 字符串
    undefined + 数字 = NaN

//number
console.log(Number.MAX_VALUE)
console.log(Number.MIN_VALUE)
console.log("ssc"-num) //非数字 NaN

//String
var str = '我去 你真 厉害!!'
console.log(str.lenght) //输出字符串的长度

//获取变量数据类型 蓝色number boolean  灰色null undefined  黑色string
var num = 10
console.log(typeof num) //number

数据类型转换

  • 转换为字符串类型
var num = 1
console.log(num.tostring()) //第一种
console.log(String(num)) //第二种
  • 转换为数字型类型
var age = prompt("输入你的年龄")
console.log(parseInt(age)) //转换函数 得到是整数 向下取整 120px会去掉后面的单位
console.log(parseFloat("12.323")) //转换为小数
console.log(Number("12.323")) //转换为小数
//利用算术符号 隐式转换为数字型
  • 转换为布尔型类型
//只有这五个是false其他都是true
console.log('')
console.log(0)
console.log(null)
console.log(NaN)
console.log(null)
console.log(undefined)

运算符

  • 运算符
    浮点数不能直接用来计算有精度问题
  • 前置运算符和后置运算符
    b = ++a + 2
    b = a++ + 2
    b = a++ + ++a 相当于(b = a + (++a))
  • 比较运算符
    == :会转型 (18 == ‘18’ 结果为true)
    === : 不会转型 (18 === ‘18’ 结果为false)
  • 运算优先级
    ()
    一元运算符(++ – !)
    算术运算符
    关系运算符
    相等运算符
    逻辑运算符 (逻辑与 比 逻辑或级高)
    赋值运算符
    逗号运算符

数组

  • 数组长度:元素个数
console.log(arr.length)
  • 数组中的最大值
var arr = [1,5,3,25,1000,3,6,3,45,1];
var max = arr[0];
for (let index = 1; index < arr.length; index++) {
    if (max < arr[index]) {
        max = arr[index];
    }
}
console.log(max);
  • 数组切割字符串
var strArr = ['aad','asdas','123','xasda'];
var str = '';
for (let index = 0; index < strArr.length; index++) {
    str += (strArr[index]+'&')
}
console.log(str);
  • 数组新增元素
arr.lenght = 5; //手动赋给数组的长度
  • 去除数组中的为0的元素
var arr1 = [0,10,23,25,36,52,36,0,15];
var arr2 = [];
var j = 0;
for (let index = 0; index < arr1.length; index++) {
    if (arr1[index] != 0) {
        arr2[j] = arr1[index];
        j++;
    }
}
console.log(arr2);
  • 反转数组
var arr1 = [0,1,2,3,4,5,6,7,8];
var arr2 = [];
var j = 0;
for (let index = (arr1.length-1); index >= 0; index--) {
    arr2[j] = arr1[index];
    j++;
}
console.log(arr2);
  • 冒泡排序
var arr1 = [1,0,8,5,2,3,7,4,6];
var temp;
var flag = 0;
for (let i = arr1.length; i > 0 ; i--) {
    flag = 0;
    for (let j = 0 ;j < i ;j++) {
        if (arr1[j] > arr1[j+1]) {
            temp = arr1[j];
            arr1[j] = arr1[j+1];
            arr1[j+1] = temp;
            flag = 1;
        }
    }
    if (flag == 0){
        break;
    }
    console.log(arr1);
}

函数

  • 格式:
    function 函数名(){
    函数体;
    }
    var 变量名 = function(){
    匿名函数函数体
    }
  • 形参的个数小于实参个数 则会忽略后面的实参
  • 形参的个数大于实参个数 则多余的形参会变成undefined (一个)
  • 函数无返回值就返回的是undefined

arguments

  • 不确定有多少个参数传递时,不好定义形参的个数时,可以通过arguments(内置对象存储了所有的实参)获取
  • 伪数组:
    • 具有length属性
    • 按照索引方式存储
    • 没有数组的 pop push 函数

作用域

  • 全局和局部优先局部
  • 在函数内部直接使用的变量也是全局变量(要调用函数之后才生效)

预解析

  • js会把var 和 function提升到当前作用域的组前面
  • 参考离自己最近的变量值

对象

  • 对象里面可以拥有匿名函数
    • 匿名函数 调用时要带上小括号
  • 调用属性的方式:
    • obj.属性名
    • obj[’属性名‘]

构造函数

  • 构造函数创建对象为了解决批量创建对象
    • function 构造函数名() {
      this.属性 = 值;
      this.方法 = function(){}
      }
  • 构造函数和对象
    • 构造函数是指一类抽象出来的
    • 对象是具体的指某一个对象
function Star(uanme ,age ,sex){
    this.uanme = uanme;
    this.age = age;
    this.sex = sex;
}

var star1 =  new Star("刘德华",18,'男');
console.log(star1);

new

  • new的四步走:

    • 创建一个空的对象
    • this.就会指向创建的空对象
    • 执行构造函数给对象添加属性和方法
    • 返回这个新对象

遍历对象

function Star(uanme ,age ,sex){
    this.uanme = uanme;
    this.age = age;
    this.sex = sex;
}
var star1 =  new Star("刘德华",18,'男');
for (const key in star1) {
    console.log(key); //获取属性名
    console.log(star1.key); //undefined
    console.log(star1[key]); //获取属性值
}

内置对象

  • JS已经提供的常用的对象和功能 (常用:Math Date Array String)

Math对象

  • MDN Math 标准库
  • Math.abs 绝对值
  • Math.floor 向下取整
  • Math.ceil 向上取整
  • Math.round 四舍五入 (数字五比较特殊 往大了取 负数比较特殊 -1.5取-1)
  • Math.random() 返回一个浮点数的随机小数 (0<=x<1)
// 猜数字游戏
var rd = Math.floor(Math.random()*(10)+1);
while (true) {
    var num = prompt("输入一个1-10之间的数字:")
    if (rd < num) {
        alert("大了")
    }else if (rd > num) {
        alert("小了")
    }else{
        alert("恭喜你,猜对啦")
        setTimeout(3000);
        break;
    }
}

日期对象

var date = new Date();
console.log(date);
  • 常用的写法
var date = new Date(2019,10,1); //输出的月份会比真实月份大一个月
var date = new Date('2019/5/1'); //输出的月份是正确的
  • 月份是0-11 星期几中 0 代表周日
  • 起始时间是1970-01-01
 var date = new Date();
 console.log(date); 
 console.log(date.valueOf()); 
 console.log(date.getTime());
 // 程序中最常用的写法
 var date1 = +new Date() ;
 console.log(date1);
 // H5的最新写法
 console.log(Date.now());

Array

arr instanceof Array; // 返回值时true 或者 false
Array.isArray(arr); //H5新增的方法 ie9以上支持
  • 添加删除元素
arr.push(元素); //在数组末尾添加元素 有返回值 返回数组的新长度 原数组也会发生变化
arr.unshift(元素); // 在数组的前面追加元素 有返回值 返回的数组的新长度 原数组也会发生变化

arr.pop(); // 删除数组的最后一个元素 有返回值 返回的是被弹出来的最后一个元素
arr.shift(); // 删除数组的第一个元素 有返回值 返回的是被弹出来的第一个元素
  • 反转数组
arr.reverse(); //反转数组
  • 冒泡排序
arr.sort();  // 只会按照个位数排序
arr.sort(function(a,b){
		return a-b; // 升序
		return b-a; // 降序
	}
)
  • 获取数组的索引
arr.indexOf(元素); // 从前面查找只返回第一个元素的索引号 找不到就返回-1  
arr.lastIndexOf(元素); // 从后面查找只返回第一个元素的索引号 找不到就返回-1  
  • 数组去重
function quChong(arr) {
   var nowArr = [];
   for (let i = 0; i < arr.length; i++) {
       if (nowArr.indexOf(arr[i]) === -1) {
           nowArr.push(arr[i]);
       }
   }
   return nowArr;
}
var demo = quChong(['1','2','1','3']);
console.log(demo);
  • 数组转化为字符串
var arr = [1,2,3];
arr.toString()
arr.join(); // 默认逗号隔开
arr.join('-'); //用-隔开

String

  • 基本包装类型
var str = 'anyday';
console.log(str.lenght);

// 等价于
var temp = new String('anyday');
var str = temp;
temp = null; // 销毁临时变量temp
  • 字符串不可变性 不要大量拼接字符串
  • 字符串所有方法都不会修改字符串本身,而是返回一个新的字符串
    在这里插入图片描述
// 执行速度很慢并且可能会卡死
var str = '我去';
for (let i = 0;i<10000000000;i++){
	str += '你好!!'
}
  • 根据字符返回位置
var str = '改革春风吹满地';
console.log(str.indexOf('春'), 起始位置); // 从索引后面开始查找
console.log(str.lastIndexOf('春')); // 从后面开始查找 

var str = 'asdjbaoasdjhadasjhdaodhjadojasdjosad';
function searchO(str1,target) {
    var i = 1;
    var weiZhi = [];
    while (str1.indexOf(target,i) != -1) {
        weiZhi.push(str1.indexOf(target,i));
        i = str1.indexOf(target,i);
        i = i + 1;
    }
    console.log(weiZhi);
}
searchO(str,'b');
  • 根据位置返回字符
str.charAt(index); // 根据index返回字符
str.charCodeAt(0); // 返回ASCII码确定用户按了哪个键
str[index]; // H5和IE8+支持
  • 统计出现最多的字符和次数
function maxTimes(str){
    var obj = new Object();
    for (let index = 0; index < str.length; index++) {
        console.log(str[index]);
        if (obj[str[index]]) {
            obj[str[index]] += 1;
        }else{
            obj[str[index]] = 1; 
        }
    }
    console.log(obj);
}
maxTimes(str);

字符串操作重要方法

在这里插入图片描述

  • str.replace(被替换字符,替换为的字符) // 只会替换第一个字符
  • str.split(需要被什么字符隔开) // 把字符串按照某个字符隔开并且把字符串变为数组
  • str.toUpperCase() //转为大写
  • str.Lower() // 转换为小写

简单数据类型和复杂类型

  • string number boolean null undefined (简单数据类型)
    • 如果一个对象没想好存放什么就先赋值为null
  • 简单数据类型存放在栈里面 复杂数据类型存放在堆里面
  • 复杂对象里面存数据现在堆里面开辟一个数据空间,通过栈里面的十六进制的地址来指向它

简单数据类型传参

在这里插入图片描述

复杂数据类型传参

在这里插入图片描述
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值
OSZAR »