console.log(arr.length);

const arr = [1, 2, 3]; 

arr.splice(2, 1); 

console.log(arr);

const arr2 = arr.filter(item => item % 2 == 0); 

console.log(arr2)

const arr1 = [1, 2, 3]; 

const arr2 = [4, 5, 6]; 

const arr3 = arr1.concat(arr2);

console.log(arr3 )

var person = [

 { id: 1, name: "小明", score: 98 },

 { id: 2, name: "小张", score: 88 },

 { id: 3, name: "小李", score: 78 },

 { id: 4, name: "小王", score: 58 },

 { id: 5, name: "小红", score: 69 }

  ]

 var res = person.filter( (p) => { return p.score > 80}  )

  console.log(res)

补充横线处的代码，实现如图所示的效果：

 <div id="app">

             <h2>所有图书信息</h2>

        <ul>

            <li v-for="                           ">

                自动生成的索引号：{{index+1}}---书名：{{book.title}}--书id:{{book.id}}--是否看完：{{book.isComplete}}</li>

        </ul>

</div>

<script>

        const app = Vue.createApp({

            data() {

                return {

                    books: [

                        { id: 1, title: "三国演义", isComplete: true },

                        { id: 2, title: "红楼梦", isComplete: false },

                        { id: 3, title: "水浒传", isComplete: true },

                        { id: 4, title: "人生", isComplete: false },

                        { id: 5, title: "平凡世间", isComplete: true },

                    ],

}

}

})

app.mount("#app")

 <div id="root">

        ID<input type="text" v-model="id"> 书名：<input type="text" v-model="name"><input type="button" value="添加图书" @click="addBook">

        <h2>所有图书信息</h2>

        <ul>

            <li v-for="(book,index) in books">

                          书ID：{{book.id}}---书名：{{book.title}}</li>

        </ul>

    </div>

 <script>

        const app = Vue.createApp({

            data() {

                return {

                    books: [

                        { id: 1, title: "三国演义", isComplete: true },

                        { id: 2, title: "红楼梦", isComplete: false },

                        { id: 3, title: "水浒传", isComplete: true },

                        { id: 4, title: "人生", isComplete: false },

                    ],

                    id: 0,

                    name: "",

                }

            },

            methods: {

                addBook() {

                    const obj = { id: this.id, title: this.name }

                   ————————————————

                }

            },

        })

        app.mount("#root")

    </script>

<div id="app">

 <ul>

<template v-for="(book,index) in books">

                <li   _________________________________________>

                    自动生成的索引号：{{index+1}}---书名：{{book.title}}--书id:{{book.id}}--是否看完：{{book.isComplete}}</li>

            </template>

        </ul>

</div>

const app = Vue.createApp({

            data() {

                return {

                    books: [

                        { id: 1, title: "三国演义", isComplete: true },

                        { id: 2, title: "红楼梦", isComplete: false },

                        { id: 3, title: "水浒传", isComplete: true },

                        { id: 4, title: "人生", isComplete: false },

                    ],

                    id: 0,

                    name: "",

                    isComplete: false

                }

            },

        })

        app.mount("#app")

<div id="App">

        <p>{{ len }}</p>

    </div>

    <script>

        const app = Vue.createApp({

            data() {

                return {

                    str: 'JavaScript'

                }

            },

            computed: { len: function () { return this.str.length; } }

        })

        app.mount("#App")

    </script>

 <div id="App">

        <span>{{ str.toLowerCase() }}</span>

    </div>

    <script>

        const app = Vue.createApp({

            data() {

                return {

                    str : 'BETTER' 

                }

            },

        })

        app.mount("#App")

    </script>

<div id="app">    

       <p v-if="a==1">真</p>  

      <p v-else>假</p>

 </div>

<script>

        const app = Vue.createApp({

            data() {

                return {

                   a:0

                }

            },

        })

        app.mount("#Application")

    </script>

 <div id="App">

         <button ______________="show">显示</button> 

    </div>

<div id="App">

        <button v-on:click="__________">显示</button>

    </div>

    <script>

        const app = Vue.createApp({

            data(){

                returen{

                     str:'Vue.js'

                }

           },

            methods: {

                show(str) { console.log(str); }

            }

        })

        app.mount("#App")

    </script>

父组件代码

<div id="app">     <my-component msg="传递的数据"></my-component> </div> 

子组件代码

<template>

    <p>{{msg}}</p>

  </template>

<script>

export default {

              填写代码                                 

};

</script>