11-字符串--highgh的博客--JavaScript的学习笔记

最新推荐文章于 2024-06-16 18:09:06 发布

一只情绪稳定的老虎

最新推荐文章于 2024-06-16 18:09:06 发布

阅读量191

点赞数

分类专栏： JavaScript基础学习心得文章标签： javascript

本文链接：https://blog.csdn.net/highgh/article/details/109513092

版权

1.字符串简介

字符串就是"人类的自然语言"

字符串要用引号包裹，双引号或者单引号均可

数字11和字符串’11’在语义上是不同的，前者表达—个数量,后者是一个文本

要将一个变量的值“插入”到字符串中，要“斩断链接”

let year = 2020;

let  str = "北京冬季奥运会在" + year + "年召开"

console.log(str); //北京冬季奥运会在2020年召开

2.模板字符串

语法：

`字符串 ${变量/表达式} 字符串` （键盘tab上面那个键）

作用：

字符串模板简化了一些繁琐的字符串拼接操作

let str = `北京冬季奥运会在${
     year}年召开`;

普通字符串和模板字符串的区别

let user1 = "小甘";
let user2 = `小甘`;
console.log(user1 === user2); //true

<script>
      let person = {
    
        username: "小甘",
        age: 16,
        sex: "老板",
      };
      //let info =
      //  "我的名字是:" +
      //  person.username +
      //  ",我的年龄是" +
      //  person.age +
      //  ",我是个" +
      //  person.sex;

      let info = `我的名字是:${
      person.username},我的年龄是${
      person.age},我是个${
      person.sex}`;

      //和其他东西一起使用的时候,使用模板字符串,方便注入
      //其他情况下使用模板字符串和一般字符串都行

      console.log(info);
    </script>

模板字符串的注意事项

输出多行字符串

//一般字符串
let str = "第一行\n第二行"
console.log(str);

//模板字符串
let str = `第一行\n第二行`;
let str = `第一行
第二行`;
console.log(str);

//模板字符串中，所有的空格、换行或缩进都会被保留在输出之中

输出`和\等特殊字符

let info = `\`\\`
console.log(info);

模板字符串的注入

let user = "小甘";
let person = {
   age: 16, sex: "male"};

let getSex = function(sex){
   
    return sex === "male"? "男" : "女";
}


let info = `${
     user},${
     person.age},${
     getSex(person.sex)} `
console.log(info);

///只要最终可以得出一个值的就可以通过$注入到模板字符串中

字符串模板中可以使用表达式

let a = Math.random();
let str = `<div> ${
     a > 0.5 ? "正确" : "错误"} </div>`;
console.log(str);

字符串模板可以代替函数的小括号执行函数（了解即可）

function fn(x){
   
    console.log(x)
}

// 通过字符串模板执行的函数，参数为数组的形式
fn`1`   //  [1] 
fn`1,2` //  [1,2]

模板字符串的应用

<style>
    * {
    
        margin: 0;
        padding: 0;
        list-style: none;
    }
    p,
    ul {
    
        text-align: center;
        font-size: 30px;
        margin: 50px 0px;
    }
</style>
</head>
<body>
    <p>学生信息表</p>
    <ul id="list">
        <li>信息加载中.....</li>
    </ul>

    <script>
        //数据
        let students = [
            {
    
                username: "小甘",
                age: 18,
                sex: "male",
            },
            {
    
                username: "小菲",
                age: 12,
                sex: "female",
            },
            {
    
                username: "二狗",
                age: 16,
                sex: "male",
            }
        ];
        let html = "";

        for(let i = 0; i < students.length; i++){
    
            html += `<li>我的名字是 ${
      students[i].username},我的年龄${
      students[i].age},我的性别${
      students[i].sex}<li>`;
        } 

        let list = document.getElementById("list");

        list.innerHTML = html;
    </script>

3.包装对象

原始类型有没有属性和方法?

按原始类型与引用类型的定义来说

只有引用类型（对象）才有属性和方法，原始类型是没有自己的属性和方法的

let num = 100;
//我们使用toString方法将num这个数值型转换成了字符串型  为什么num就真的调用了toString却没有报错呢?
let str = num.toString(); 
console.log(typeof str); //string

这里面我们用原始类型num调用了toString方法，

那是不是原始类型也能调用方法呢，答案是否定的。仍然只有对象才能拥有自己的属性和方法。

JavaScript中有三种包装对象，

他们对应的构造函数分别是String字符串，Number数值，Boolean布尔值。

很多编程语言都有包装对象的设计，

包装对象的目的就是为了让基本类型值可以从它们的构造函数的prototype上获得方法

let a = new Number(123);
let b = new String("abc");
let c = new Boolean(true);

console.log(typeof a);// "object"
console.log(typeof b);// "object"
console.log(typeof c);// "object"

console.log(a === 123); // false
console.log(b === 'abc'); // false
console.log

最低0.47元/天解锁文章

一只情绪稳定的老虎

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
11-字符串--highgh的博客--JavaScript的学习笔记

1.字符串简介字符串就是"人类的自然语言"字符串要用引号包裹，双引号或者单引号均可数字11和字符串’11’在语义上是不同的，前者表达—个数量,后者是一个文本要将一个变量的值“插入”到字符串中，要“斩断链接”let year = 2020;let str = "北京冬季奥运会在" + year + "年召开"console.log(str); //北京冬季奥运会在2020年召开2.模板字符串语法：`字符串 ${变量/表达式} 字符串` （键盘tab上面那个键）作用：
复制链接

扫一扫