javascript一些基本操作

 

  首先,我们需要知道JavaScript(JS)的数据类型有哪些：

它有字符串、object、数组、数字这些类型

2、JS使用时声明变量：

我们通常使用let或者var声明变量

let x = '海上升明月'   // 作用域不同， 局部使用
var y = '天涯共此时'   // 全局的

3、JS输出可以以不同的方式“显示” 数据：

• 使用 window.alert() 写入警告框

• 使用 document.write() 写入HTML输出

• 使用innerHTML 写入 HTML 元素

• 使用 console.log() 写入浏览器控制台

使用innerHTML输出元素：

<!--  定义标签  起个id名为demo-->
<p id="demo"></p>
<!--  引入js, 使用script 标签  -->
<script>
    // 声明一个变量
    let x = '海上升明月'
    // 选择标签，并在标签当中插入数据
    document.getElementById('demo').innerHTML = x
</script>

使用write输出：

<!--  定义标签  起个id名为demo-->
<p id="demo">1234</p>
<p id="demo1">12342</p>
<button onclick="f()">
    点击一下
</button>
<!--  引入js, 使用script 标签  -->
<script>
    // 声明一个变量
    let x = '海上升明月'
    // 选择标签，并在标签当中插入数据
    // document.getElementById('demo').innerHTML = x
    // 弹窗效果
    // alert(x)
    // 在控制台打印
    console.log(x)
    function f() {
        let x = '12345678'
        document.write(x)
    }
</script>

一些常见的JS转义序列：

代码	效果
\b	退格键
\f	换页
\n	换行
\r	回车

2、字符串方法:

       1.length: 字符串长度

// 1、判断字符串的长度
console.log(x.length)

       2. **indexOf()******方法返回字符串中指定文本首次出现的索引（位置）

// 查找字符的下标
console.log((x.indexOf('明月')));

           indexOf方法一般都接受作为检索起始位置的第二个参数。

// 从某个位置开始，查找明月
console.log((x.indexOf('明月', 12)));

 

        3. **slice()******提取字符串的某个部分并在新字符串中返回被提取的部分。

// 从某个位置开始，到某个位置结束，查找对应的字符 slice()
console.log(x.slice(6, 13))

        4. replace()******方法用另一个值替换在字符串中指定的值：

// 替换 replace() , 替换第一次匹配到的内容
console.log(x.replace('明月', 'mingyue')

      5. 通过toUpperCase()******把字符串转换为大写

// 小写转大写
console.log((yy.toUpperCase()))

      6.通过toLowerCase()******把字符串转换为小写

// 大写转小写
console.log(y.toLowerCase())

     7  **concat()******连接两个或多个字符串

// 连接两个字符  concat
// 用第一个字符.concat(要拼接的内容)  可以是多个字符串
console.log(y.concat('+', yy))

   8 trim()方法删除字符串两端空白符

// 去除两端的空格 trim()
console.log(y)
console.log(yy.trim())

   9  可以通过split**()将字符串转换为数组

// split， 切片，按照一个规则，对字符串进行分隔，分隔成列表
console.log(x.split('，'))

3、数值类型

数值的处理方法

1. toStrin**g()******以字符串返回数值。

所有数字方法可用于任意类型的数字（字面量、变量或表达式）：

// 数值类型
let x = 12;
// typeof 查看数据的类型
console.log(typeof x, x.toString(), typeof x.toString())

**toFixed()******返回字符串值，它包含了指定位数小数的数字：

console.log(x.toFixed(2));

toFixed(2)非常适合处理金钱。

**valueOf()******以数值返回数值：

console.log(x.valueOf())

这三种 JavaScript 方法可用于将变量转换为数字：

• Number() 方法
• parseInt() 方法
• parseFloat() 方法

这些方法并非数字方法，而是全局JavaScript 方法。

方法	描述
Number()	返回数字，由其参数转换而来。
parseFloat()	解析其参数并返回浮点数。
parseInt()	解析其参数并返回整数。

4、JavaScript数组

JavaScript 数组用于在单一变量中存储多个值。

创建数组

使用数组文本是创建 JavaScript数组最简单的方法。

var cars = [
    "Saab",
    "Volvo",
    "BMW"
];

访问数组元素 我们通过引用**索引号（下标号）**来引用某个数组元素。

这条语句访问 cars中的首个元素的值：

// 列表
let y = ['car', 'bird', 'bike', 'bus', 'plane']
document.querySelector('#demo01').innerHTML = y[3]

这条语句修改 cars 中的首个元素：

数组是对象 数组是一种特殊类型的对象。在 JavaScript 中对数组使用 typeof 运算符会返回"object"。

1、获取数组的长度：aList.length

document.querySelector('#demo02').innerHTML = 'y数据的长度是：' + y.length

2、用下标来操作数组中的数据：aList[0]

3、join()将数组成员通过一个分隔符合并成字符串

document.querySelector('#demo03').innerHTML = y.join('-')

4、push() 和 pop() 从数组最后增加成员或删除成员

y.push('train')
document.querySelector('#demo04').innerHTML = y[y.indexOf('train')]

5、unshift() 和shift() 从数组前面增加成员或删除成员

y.unshift('train')  // 在前面添加元素
document.querySelector('#demo05').innerHTML = y[0]
y.shift()

6、reverse() 将数组反转

console.log(y.reverse())

7、indexOf() 返回数组中元素第一次出现的索引值

y.indexOf('bird')

8、splice() 在数组中增加或删除成员

 

5、 条件

if(条件) {
} else if (条件){
  
} else {
  
}
if(条件) {
}
if(条件) {
}
if(条件) {
}

应该场景

// 当我接收后台数据成功以后，进行状态码的判断
// 以登录成功为例
if(result.data.code == 200) {
    console.log('登录成功')
}else {
  console.log('登录失败')
}

在页面当中判断用户是否登录

7、for循环

用来循环遍历列表
语法1： 
for(let i; i=0; i<list.lenght; i++) {
  // i是索引
}
for(i in lists) {
  // i是索引
}
lists.forEach(function (i) {
    // i是对象
})
let x = ''
for (i in lists) {
console.log(i, lists[i])
x += lists[i]
}
document.getElementById('div01').innerHTML = x
let y = ''
lists.forEach(function (item) {
console.log(item)
y += item
})
document.getElementById('div02').innerHTML = y